小程序setInterval倒计时数据没有按秒更新,请问是怎么回事?
问题描述
因为项目需要做倒计时,但是console.log的时候是按秒输出的数据,页面上的数据更新却不是如此,而是每7,8秒更新一次,如倒计时为:00:10 ,下一次更新的描述要到7或8秒后,变成00:02
而这个延迟更新的现象,只在不进行操作的时候发生,当我不停上下滚动页面的时候,倒计时是正常进行的;
问题出现的环境背景及自己尝试过哪些方法
相关代码
// 请把代码文本粘贴到下方(请勿用图片代替代码)
//这个函数就是倒计时的操作,传入的arr是需要做倒计时的商品,在里面有需要倒计时的秒数
countDown(arr){
var timer=null;
var timeArr=[];
var that = this;
for(let i in arr){ //把所有需要倒计时的秒数传入一个新数组timeArr
timeArr[i] = arr[i].show.time
}
console.log("获取数组",timeArr);
timer=setInterval(function(){
var day=0,
hour=0,
minute=0,
second=0;//时间默认值
for(let i in timeArr){ //遍历timeArr,然后把那些秒数转换为相对应的格式
let times = timeArr[i]
if(times > 0){
day = Math.floor(times / (60 * 60 * 24));
hour = Math.floor(times / (60 * 60)) - (day * 24);
minute = Math.floor(times / 60) - (day * 24 * 60) - (hour * 60);
second = Math.floor(times) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
}
if (day <= 9) day = '0' + day;
if (hour <= 9) hour = '0' + hour;
if (minute <= 9) minute = '0' + minute;
if (second <= 9) second = '0' + second;
that.skill.list[i].show.w_time[0]=day;that.skill.list[i].show.w_time[1]=hour;
that.skill.list[i].show.w_time[2]=minute;that.skill.list[i].show.w_time[3]=second;
console.log( "time"+i+" is: "+day+"天:"+hour+"小时:"+minute+"分钟:"+second+"秒");
if(times<=0){
that.skill.list[i].show.w_time=['00','00','00','00']
}
timeArr[i]--;
}
},1000);
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
明白了,因为setInterval是延迟操作,所以每一次结束的时候要重新渲染一下页面,在
“timeArr[i]--;”下面加一句“that.$apply();”就可以了