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

实现效果

相关推荐
Stanford_11065 小时前
关于单片机的原理与应用!
c++·单片机·嵌入式硬件·微信小程序·微信公众平台·微信开放平台
OEC小胖胖6 小时前
交互的脉络:小程序事件系统详解
前端·微信小程序·小程序·微信开放平台
产品大道7 小时前
[分享] 千呼万唤始出来《WX小程序反编译教程》
小程序
毕设源码-邱学长10 小时前
【开题答辩全过程】以 “勤工有道”微信小程序为例,包含答辩的问题和答案
微信小程序·小程序
计算机学姐10 小时前
基于微信小程序的智能在线预约挂号系统【2026最新】
java·vue.js·spring boot·mysql·微信小程序·小程序·tomcat
说私域14 小时前
定制开发开源AI智能名片S2B2C商城小程序在智慧零售价值链重构中的价值研究
人工智能·小程序·开源
00后程序员张15 小时前
iOS 26 系统流畅度深度剖析,Liquid Glass 视效与界面滑动的实际测评
android·macos·ios·小程序·uni-app·cocoa·iphone
小小王app小程序开发16 小时前
废品回收小程序:从 “扔垃圾“ 到 “变资源“ 的体验革命
java·开发语言·小程序
2501_9159214317 小时前
uWSGI + HTTPS 实战指南,配置、证书、TLS 终止与调试全流程(适用于生产与真机抓包排查)
网络协议·http·ios·小程序·https·uni-app·iphone
2501_9160088921 小时前
iOS 26 系统流畅度剖析:Liquid Glass 动画表现 + 用户反馈
android·macos·ios·小程序·uni-app·cocoa·iphone