小程序
小游戏
企业微信
微信支付
扫描小程序码分享
先有一需求,在小程序中实现倒计时,但是查看文档后发现小程序的setDate是异步的,所以就导致倒计时不准,或者渲染得很奇怪(一下子很快,一下子暂停)
5 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
开始的时候 new Date()获取当前毫秒数,setInterval 200ms 去获取毫秒数,根据差值来设置秒数,而不是setInterval 1000ms 去把数字-1
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
这个没有理解
截图看看你倒计时的方法呢
getRightTime: function (endTime) {
var nowDate = new Date();
var endDate = endTime;
var leftTime = endDate - nowDate.getTime();
if (leftTime / (3600 * 1000) >= 72) {
eturn;
} else {
var d = Math.floor(leftTime / (24 * 3600 * 1000));//计算天数
var leave1 = leftTime % (24 * 3600 * 1000);
var h = Math.floor(leave1 / (3600 * 1000));
var leave2 = leave1 % (3600 * 1000);
var m = Math.floor(leave2 / (60 * 1000));
var leave3 = leave2 % (60 * 1000);
var s = Math.round(leave3 / 1000);
this.setData({
leftTime: this.checkTime(d) + '天' + this.checkTime(h) + '时' + this.checkTime(m) + '分' + this.checkTime(s) + '秒'
}, ()=> {})
}
},
timer = setInterval(() => {
that.getRightTime(start);
if (that.data.leftTime == '00:00:01') {
clearInterval(timer);
})
}, 1000)
把循环的时间改为200ms,这样平均误差要小一点。。
倒计时都是拿1秒来做间隔,要是200ms,不好弄啊
要不了解下 Wuss Weapp 的倒计时组件怎么写的吗 https://github.com/phonycode/wuss-weapp/blob/master/dist/w-countdown/index.js
我都是用setTimeout做倒计时
占了两条,所以倒计时,频繁的去setData不好
this.setData({},function(){
// 回调
setData是同步的
setData 函数用于将数据从逻辑层发送到视图层(异步),同时改变对应的 this.data 的值(同步)。
setData
this.data
https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/page.html#pageprototypesetdataobject-data-function-callback
setInterval,如果你没有进行其它频繁的操作,就是按照时间执行,应该不会一快一慢
也不知道是哪里出了问题
代码?
//天
//时
//分
//秒
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
开始的时候 new Date()获取当前毫秒数,setInterval 200ms 去获取毫秒数,根据差值来设置秒数,而不是setInterval 1000ms 去把数字-1
这个没有理解
截图看看你倒计时的方法呢
getRightTime: function (endTime) {
var nowDate = new Date();
var endDate = endTime;
var leftTime = endDate - nowDate.getTime();
if (leftTime / (3600 * 1000) >= 72) {
eturn;
} else {
var d = Math.floor(leftTime / (24 * 3600 * 1000));//计算天数
var leave1 = leftTime % (24 * 3600 * 1000);
var h = Math.floor(leave1 / (3600 * 1000));
var leave2 = leave1 % (3600 * 1000);
var m = Math.floor(leave2 / (60 * 1000));
var leave3 = leave2 % (60 * 1000);
var s = Math.round(leave3 / 1000);
this.setData({
leftTime: this.checkTime(d) + '天' + this.checkTime(h) + '时' + this.checkTime(m) + '分' + this.checkTime(s) + '秒'
}, ()=> {})
}
},
timer = setInterval(() => {
that.getRightTime(start);
if (that.data.leftTime == '00:00:01') {
clearInterval(timer);
})
}, 1000)
把循环的时间改为200ms,这样平均误差要小一点。。
倒计时都是拿1秒来做间隔,要是200ms,不好弄啊
要不了解下 Wuss Weapp 的倒计时组件怎么写的吗 https://github.com/phonycode/wuss-weapp/blob/master/dist/w-countdown/index.js
我都是用setTimeout做倒计时
占了两条,所以倒计时,频繁的去setData不好
this.setData({},function(){
// 回调
})
setData是同步的
setData
函数用于将数据从逻辑层发送到视图层(异步),同时改变对应的this.data
的值(同步)。https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/page.html#pageprototypesetdataobject-data-function-callback
setInterval,如果你没有进行其它频繁的操作,就是按照时间执行,应该不会一快一慢
也不知道是哪里出了问题
代码?
getRightTime: function (endTime) {
var nowDate = new Date();
var endDate = endTime;
var leftTime = endDate - nowDate.getTime();
if (leftTime / (3600 * 1000) >= 72) {
eturn;
} else {
//天
var d = Math.floor(leftTime / (24 * 3600 * 1000));//计算天数
//时
var leave1 = leftTime % (24 * 3600 * 1000);
var h = Math.floor(leave1 / (3600 * 1000));
//分
var leave2 = leave1 % (3600 * 1000);
var m = Math.floor(leave2 / (60 * 1000));
//秒
var leave3 = leave2 % (60 * 1000);
var s = Math.round(leave3 / 1000);
this.setData({
leftTime: this.checkTime(d) + '天' + this.checkTime(h) + '时' + this.checkTime(m) + '分' + this.checkTime(s) + '秒'
}, ()=> {})
}
},
timer = setInterval(() => {
that.getRightTime(start);
if (that.data.leftTime == '00:00:01') {
clearInterval(timer);
})
}, 1000)