基于考研题库小程序V2.0实现倒计时功能板块和超时判错功能

V2.0

需求沟通

需求分析

计时模块

3.1.1、功能描述←计时模块用于做题过程中对每一题的作答进行30秒倒计时,超时直接判错,同时将总用时显示在界面上;记录每次做题的总用时。

3.1.2、接口描述←与判定模块的接口为超时判定,若单题用时超过 30秒则算作错误,需要将信号给到判定模块:当用户开始做答或点击确认时接收信号,开始或是结束计时:与与本地数据库的接口为储存,需要保存单次(15题)的总用时信息用于历史记录查看。

3.1.3、数据结构描述计时的秒数为 int 整型,需要有计时结束时触发的回调函数,用于通知外部模块。对于本地缓存,可使用wx.setStorageSync来进行存储。

3.1.4、实现思路

此模块逻辑较简单清晰,可在is文件中直接编写函数,注意设置对外接口。

实现过程

计时模块用于做题过程中对每一题的作答进行30秒倒计时,超时直接判错。

技术点:倒计时+判错。

计时模块用于做题过程中对每一题的作答进行30秒倒计时,超时直接判错。使用selfInterval实现倒计时功能,每隔一秒执行一次,超时直接判错逻辑函数。

​​​​​​​

// 计时模块用于做题过程中对每一题的作答进行30秒倒计时,超时直接判错const totalSeconds = 30;
// 使用selfInterval实现倒计时功能countDownStart() {    this.setData({      seconds: totalSeconds    });    selfInterval = setInterval(()=>{      this.data.seconds--      this.setData({        seconds: this.data.seconds      });      if(this.data.seconds == 0){        clearInterval(selfInterval);        selfInterval = null;        // 超时直接判错逻辑函数        this.onCountDownfinished();      }    }, 1000);  },

实现效果

相关推荐
郭wes代码3 小时前
Cmd命令大全(万字详细版)
python·算法·小程序
A懿轩A7 小时前
C/C++ 数据结构与算法【栈和队列】 栈+队列详细解析【日常学习,考研必备】带图+详细代码
c语言·数据结构·c++·学习·考研·算法·栈和队列
.生产的驴8 小时前
SpringBoot 对接第三方登录 手机号登录 手机号验证 微信小程序登录 结合Redis SaToken
java·spring boot·redis·后端·缓存·微信小程序·maven
汤姆yu13 小时前
基于微信小程序的乡村旅游系统
微信小程序·旅游·乡村旅游
计算机徐师兄13 小时前
基于TP5框架的家具购物小程序的设计与实现【附源码、文档】
小程序·php·家具购物小程序·家具购物微信小程序·家具购物
曲辒净14 小时前
微信小程序实现二维码海报保存分享功能
微信小程序·小程序
朽木成才15 小时前
小程序快速实现大模型聊天机器人
小程序·机器人
peachSoda715 小时前
随手记:小程序使用uni.createVideoContext视频无法触发播放
小程序
何极光16 小时前
uniapp小程序样式穿透
前端·小程序·uni-app
小墨&晓末16 小时前
【PythonGui实战】自动摇号小程序
python·算法·小程序·系统安全