收藏
回答

setDate异步

问题模块 框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
API和组件 小程序 需求 this.setData({}) 客户端 6.6.7 2.2.5

先有一需求,在小程序中实现倒计时,但是查看文档后发现小程序的setDate是异步的,所以就导致倒计时不准,或者渲染得很奇怪(一下子很快,一下子暂停)

最后一次编辑于  2018-09-19  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏关注问题回答

20 个回答

  • 卢霄霄
    卢霄霄
    2018-09-19

    开始的时候 new Date()获取当前毫秒数,setInterval  200ms 去获取毫秒数,根据差值来设置秒数,而不是setInterval 1000ms 去把数字-1

    2018-09-19
    赞同 11
    回复 7
    • 你吼那么大声干什么
      你吼那么大声干什么
      2018-09-19

      这个没有理解

      2018-09-19
      赞同
      回复
    • 卢霄霄
      卢霄霄
      2018-09-19回复你吼那么大声干什么

      截图看看你倒计时的方法呢

      2018-09-19
      赞同
      回复
    • 你吼那么大声干什么
      你吼那么大声干什么
      2018-09-19回复卢霄霄

      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)

      2018-09-19
      赞同
      回复
    • 卢霄霄
      卢霄霄
      2018-09-19回复你吼那么大声干什么

      把循环的时间改为200ms,这样平均误差要小一点。。

      2018-09-19
      赞同 11
      回复
    • 你吼那么大声干什么
      你吼那么大声干什么
      2018-09-19回复卢霄霄

      倒计时都是拿1秒来做间隔,要是200ms,不好弄啊

      2018-09-19
      赞同
      回复
    查看更多(2)
  • 🚗🚕🚙🚌🚎🚒🚐🚚
    🚗🚕🚙🚌🚎🚒🚐🚚
    2018-09-19

    setData是同步的

    2018-09-19
    赞同
    回复 7
    • 你吼那么大声干什么
      你吼那么大声干什么
      2018-09-19

      setData 函数用于将数据从逻辑层发送到视图层(异步),同时改变对应的 this.data 的值(同步)。

      https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/page.html#pageprototypesetdataobject-data-function-callback

      2018-09-19
      赞同
      回复
    • 🚗🚕🚙🚌🚎🚒🚐🚚
      🚗🚕🚙🚌🚎🚒🚐🚚
      2018-09-19回复你吼那么大声干什么

      setInterval,如果你没有进行其它频繁的操作,就是按照时间执行,应该不会一快一慢

      2018-09-19
      赞同
      回复
    • 你吼那么大声干什么
      你吼那么大声干什么
      2018-09-19回复🚗🚕🚙🚌🚎🚒🚐🚚

      也不知道是哪里出了问题


      2018-09-19
      赞同
      回复
    • 🚗🚕🚙🚌🚎🚒🚐🚚
      🚗🚕🚙🚌🚎🚒🚐🚚
      2018-09-19回复你吼那么大声干什么

      代码?

      2018-09-19
      赞同
      回复
    • 你吼那么大声干什么
      你吼那么大声干什么
      2018-09-19回复🚗🚕🚙🚌🚎🚒🚐🚚

      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)


      2018-09-19
      赞同
      回复
    查看更多(2)
  • CKL
    CKL
    2018-09-19

    this.setData({},function(){

        // 回调

    })

    2018-09-19
    赞同
    回复
  • 想不到了
    想不到了
    2018-09-20

    我都是用setTimeout做倒计时


    2018-09-20
    赞同
    回复 1
    • 你吼那么大声干什么
      你吼那么大声干什么
      2018-09-20

      占了两条,所以倒计时,频繁的去setData不好

      2018-09-20
      赞同
      回复
  • Embrace🍂
    Embrace🍂
    2018-09-21

    要不了解下 Wuss Weapp 的倒计时组件怎么写的吗 https://github.com/phonycode/wuss-weapp/blob/master/dist/w-countdown/index.js

    2018-09-21
    赞同
    回复