微信小程序要设定一个定时器有两种方法

文章目录

• 前言
• 一、setInterval和 setTimeout方法有什么区别
• 二、注意点：及时回收定时器
• 三、好了，上代码
• • 1.setInterval定时器应用
  • 2.setTimeout 定时器应用
• 总结

---

前言

微信小程序要设定一个定时器有两种方法

1、setInterval：按照指定的周期（以毫秒计）来执行注册的回调函数
2、setTimeout：在定时到期以后执行注册的回调函数

详情请参阅小程序开发文档
setInterval
setTimeout

---

一、setInterval和 setTimeout方法有什么区别

setInterval，指定某个任务每隔一段时间就执行一次，也就是无限次的定时执行表达式
setTimeout，指定某个任务在指定的时间后执行一次表达式（重要的事情说三遍：一次，一次，一次）

二、注意点：及时回收定时器

定时器是全局的，并不是跟页面绑定的，当小程序从一个页面路由到另一个页面之后，前一个页面定时器应注意手动回收。

及时回收定时器
clearInterval
clearTimeout

三、好了，上代码

1.setInterval定时器应用

代码如下（示例）：

Page({
  data: {
    inter: '',
  }，
  /**
   * 启动定时器
   */
  startInter : function(){
    var that = this;
    that.data.inter= setInterval(
        function () {
            // TODO 你需要无限循环执行的任务
            console.log('setInterval 每过500毫秒执行一次任务')
        }, 500);    
  },
  /**
   * 结束定时器
   */
  endInter: function(){
    var that = this;
    that.clearInterval(that.data.inter)
  },
  /**
   * 生命周期函数--监听页面卸载
   */
 >: function () {
    this.endInter()
  },
})

2.setTimeout 定时器应用

代码如下（示例）：

Page({
  data: {
    timer : '',
  }，
  /**
   * 启动定时器
   */
  startTimer : function(){
    var that = this;
    that.data.timer = setTimeout(
        function () {
            // TODO 你需要执行的任务
            console.log('startTimer  500毫秒后执行一次任务')
        }, 500);    
  },
  /**
   * 结束定时器
   */
  endTimer: function(){
    var that = this;
    clearTimeout(that.data.timer)
  },
  /**
   * 生命周期函数--监听页面卸载
   */
 >: function () {
    this.endTimer()
  },
})

---

总结

以上就是今天要讲的内容，本文仅仅简单介绍了【微信小程序-定时器】实例应用，希望对大家有帮助。谢谢大家的阅读！

另外，也欢迎大家关注我的个人公众号 “聊者说”。