微信小程序 - 考试倒计时

源码如下（csdn提供了思路，多谢，第二个小程序项目，有惊无险（_。_）：

 1 Page({
 2   /**
 3    * 页面的初始数据
 4    */
 5   data: {
 6     timer: '', //定时器名字
 7     countDownNum: '5' //倒计时初始值
 8   },
 9   onLoad: function() {
10     this.countDown();
11   },
12   start: function() {
13     clearInterval(this.data.timer);
14     this.data.countDownNum = 6;
15     this.countDown();
16   },
17   countDown: function() {
18     let that = this;
19     let countDownNum = that.data.countDownNum; //获取倒计时初始值
20     //如果将定时器设置在外面，那么用户就看不到countDownNum的数值动态变化，所以要把定时器存进data里面
21     that.setData({
22       timer: setInterval(function() { //这里把setInterval赋值给变量名为timer的变量
23         //每隔一秒countDownNum就减一，实现同步
24         countDownNum--;
25         //然后把countDownNum存进data，好让用户知道时间在倒计着
26         that.setData({
27           countDownNum: countDownNum
28         })
29         //在倒计时还未到0时，这中间可以做其他的事情，按项目需求来
30         if (countDownNum == 0) {
31           //这里特别要注意，计时器是始终一直在走的，如果你的时间为0，那么就要关掉定时器！不然相当耗性能
32           //因为timer是存在data里面的，所以在关掉时，也要在data里取出后再关闭
33           clearInterval(that.data.timer);
34 
35           //关闭定时器之后，可作其他处理codes go here
36         }
37         that.data.countDownNum = 6;
38       }, 1000)
39     });
40   }
41 })

View Code

1. 在onload载入时，缓存list数据，开始计时，调用this.countDown();(到达60s以后，再次调用本身)，即可实现每一题到达60s以后自动跳转到下一题 ->自动

2. 单题计时60s,点下一题时，清除上一题计时器，并且再次调用this.conutDwon() -> 手动;

秒客网

微信小程序 - 考试倒计时

相关文章