微信小程序setInterval定时函数

软件发布|下载排行|最新软件

当前位置:首页IT学院IT技术

微信小程序setInterval定时函数

1029179954   2022-09-28 我要评论

1、setInterval的理解

(1)setInterval理解

setInterval定时函数,就是延迟多长时间不停的调用 setInterval中的函数,想具体了解 setInterval函数,我们先看一下 setInterval函数组成部分。

(2)setInterval组成

setInterval(function () {},时间)。function () {}就是不停执行函数,时间就是延迟多久不断地执行,重点function () {}函数

具体示例:

 setInterval(function () {
                 //.toClock1()是具体函数,写在外边
                 _this.toClock1();}, 6000);

(3)setInterval需要关闭

使用clearInterval()去关闭,具体使用看下面的内容

clearInterval()

2、setInterval放在微信小程序onshow函数里

onShow:页面显示或从后台跳回小程序时显示此页面时触发,从跳转页面返回时触发,不能传递参数

3、setInterval具体使用

(1)设置全局变量timer(timer随便起)

//在微信小程序data中写如下代码,timer全局变量
 data: {
    timer: null,
  },

(2)onshow写setInterval函数

onShow: function () {
      const _this = this
       //定时器  函数赋值给timer  方便clearInterval()使用
       _this.data.timer = setInterval(
         function () {
        _this.toClock1();        
        }, 6000);

        _this.setData({
          timer:_this.data.timer
        });
  },

toClock1()函数

//定时函数执行的内容  自己发挥   写自己的代码
toClock1(){
    console.log(this.data.timer)
}

4、离开当前页面关闭 setInterval定时函数

代码放在onhide里边

onHide: function () {
//关闭clearInterval定时函数
    clearInterval(this.data.timer);
    this.setData({
      timer: null
    });
    console.log(this.data.timer)
  },

附:微信小程序定时器setInterval()的使用注意事项

setInterval(function(){}, number 时间间隔/ms)

注意在setInterval中定义的函数中使用  this  指向的是该计时器,若要用到页面数据应如下操作:

let that=this
setInterval(function(){
   that.data.a=0;
},number 时间间隔/ms)

通过在setInterval外面设置一个变量 that 获得 页面 this 的引用,后进行操作

总结

Copyright 2022 版权所有 软件发布 访问手机版

声明:所有软件和文章来自软件开发商或者作者 如有异议 请与本站联系 联系我们