基于vue+ts实现的快速数学口算功能的实现

功能描述:

快速数学口算功能项目
要求:
1、 使用 Vue 2.0 + TypeScipt
2、 可设置计算上限(如10以内、20以内,30以内,100以内等)
3、 可设置计算方式(多选)可选项包括 加法、减法、乘法、除法
5、 开始答题后,屏幕显示需要口算的表达式,如:3 + 2 等于多少?
6、 屏幕下方提供0~9的数字键盘、后退键和确认键。
7、 点击确认键后,判断输入是否为空,如不为空,进行答案判断,并提示正确和错误,延时3秒后下一题,如果已达到设置的连续出题数量,给出最终结果,显示做题数量和正确的答案数量,下方显示再来一次按钮,点击再来一次可以重置设置相关参数再次开始口算。
源码链接

项目代码链接为:http://git.fastoa.co/Ztq/ztq_vue
实现效果在这里插入图片描述

实现思路

在本次数学口算项目的实现中,是基于Vue的脚手架vue-cli+ts+less实现的,通过定义接口及调用,和各种方法及定时器的调用进行简单的实现,刚入门学习vue的脚手架的同志有需要可以参考下

技术介绍

vue-cli介绍:
vue脚手架指的是vue-cli,它是一个专门为单页面应用快速搭建繁杂的脚手架,它可以轻松的创建新的应用程序而且可用于自动生成vue和webpack的项目模板。

vue-cli是有Vue提供的一个官方cli,专门为单页面应用快速搭建繁杂的脚手架。它是用于自动生成vue.js+webpack的项目模板,是为现代前端工作流提供了 batteries-included

参考来源:作者:致自己_cb38及相关安装和使用教程请参考:https://www.jianshu.com/p/06a9f112867d
Typescript介绍
TypeScript 是一种给 JavaScript 添加特性的语言扩展。是开源和跨平台的编程语言。它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。 起源于使用JavaScript开发的大型项目 。由于JavaScript语言本身的局限性,难以胜任和维护大型项目开发。因此微软开发了TypeScript ,使得其能够胜任开发大型项目。

TS官方文档学习地址为:https://www.tslang.cn/docs/home.html

less介绍
Less 是一门 CSS 预处理语言,它扩展了 CSS 语言,增加了变量、Mixin、函数等特性,使 CSS 更易维护和扩展。
Less 可以运行在 Node 或浏览器端。

less官方文档学习地址为:http://lesscss.cn/#using-less

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值