基于考研题库小程序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);  },

实现效果

相关推荐
汝生淮南吾在北1 小时前
SpringBoot3+Vue3小区物业报修系统+微信小程序
微信小程序·小程序·vue·毕业设计·springboot·课程设计·毕设
静待雨落1 小时前
如何在Taro项目中使用axios
微信小程序·taro
前端小黑屋3 小时前
小程序直播挂件Pendant问题
前端·微信小程序·直播
汤姆yu3 小时前
基于微信小程序的自习室座位预约系统
微信小程序·小程序
喝牛奶的小蜜蜂4 小时前
微信小程序|云环境共享-使用指南
前端·微信小程序·ai编程
2501_915106326 小时前
HTTP 协议详解,HTTP 协议在真实运行环境中的表现差异
网络·网络协议·http·ios·小程序·uni-app·iphone
imbackneverdie6 小时前
AI工具如何重塑综述写作新体验
数据库·人工智能·考研·自然语言处理·aigc·论文·ai写作
千寻技术帮7 小时前
10379_基于SSM的校园跑腿服务平台
mysql·微信小程序·校园跑腿·ssm
焦糖玛奇朵婷7 小时前
扭蛋机小程序:线上扭蛋机模式发展新形势[特殊字符]
大数据·数据库·程序人生·小程序·软件需求
云云只是个程序马喽8 小时前
海外短剧系统开发核心功能设计及上线材料准备
小程序·php