微信小程序使用 setInterval 制作计时器后台延迟问题

微信小程序使用 setInterval 制作计时器后台延迟问题

之前参加2020年微信小程序应用开发大赛的时候写了一个用于校园足球的微信小程序——踢在浙大。

在小程序的设计过程中出现了一个裁判工具的功能，简单地说就是裁判在比赛过程中使用裁判工具中秒表的功能，来记录在第几分钟发生了什么事情。举个例子，如下图就是比赛过程中记录的比赛事件。

因为当时刚开始学习JavaScript，所以实际上有很多的内容一知半解甚至根本不懂但就要开始实现这样一个任务。在网上搜集了大量的资料之后最终终于发现可以使用 setInterval 来实现我所需的功能。setInterval与setTimeout的使用差别不大，参数都是一样的。区别就在于setTimeout是到时执行一次，setInterval是根据设置的时间来回调的，比如每秒回调一次。

首先对开启计时的功能进行编写，开始计时就是将各个初始值归零并进行 setInterval的初始化设置。

  // 比赛开始，设置计时开始
  begin: function () {
   
    var that = this
    var app = getApp()
    clearInterval(intt); // 设置停止（暂停），时间重置，从00:00开始
    that.setData({
   
      minute: this.data.minute,
      second: this.data.second,
      millisecond: this.data.millisecond,
      timecount: this.data.minute + ':' + this.data.second,
    })
    intt = setInterval(function () {
    that.timer() }, 50); // 每 50 ms回调一次