让一个变量自加或者自减,不能使数据在页面实时地更新,举个例子:
js文件:
Page({
data:{
num = 1, //用于自加的变量
timer:null //定义定时器的返回值
},
onLoad: function (options) {
//使用定时器,每隔一秒让num自加一次
this.data.timer=setInterval(()=>{
this.data.num++
console.log(this.data.num) //控制台输出
},1000)
}
})
.wxml文件
<view>{{num}}</view>
根据以上代码,最后的效果应该是从1每隔一秒就自加1,但是,页面一直是显示1,但是控制台(console)输出是1,2,3,……
这是我在做小程序时发现的现象,后来用setData函数就可以实现页面不断更新数据,只需把改成下面这样:
onLoad: function (options) {
//使用定时器,每隔一秒让num自加一次
this.data.timer=setInterval(()=>{
this.setData({
num: this.data.num + 1
})
console.log(this.data.num) //控制台输出
},1000)
}
这样就可以实现页面实时更新数据