uni 微信小程序定时器页面不更新

2021/5/18 1:25:18

本文主要是介绍uni 微信小程序定时器页面不更新,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

uni 编写微信小程序,uni中写定时器在小程序端会出现,页面更新不及时的情况

今天在项目中遇到了这个问题,苦苦找了2个小时,

下面以我在倒计时定时器中遇到的问题为例,如何去解决

for (let index in t.goodsList) {
  let timeLeave = new Date(t.goodsList[index].endTime).getTime() - new Date().getTime()
  if (timeLeave <= 0) {
    t.goodsList[index].goodhidden = true
    clearInterval(t.cutdownsetIntervalList[index])
    t.cutdownsetIntervalList[index] = null
    return
  }
  t.cutdownsetIntervalList[index] = setInterval(function() {
  if (t.homeTagIndex !== 4) {
    clearInterval(t.cutdownsetIntervalList[index])
    t.cutdownsetIntervalList[index] = null
    return
  }
  t.cutdownTimeList[index] = t.timeCl(t.goodsList[index].startTime, t.goodsList[index].endTime)
  t.$forceUpdate();
// console.log(t.cutdownTimeList[index]) // 这里输出的数据都会更新

 

一开始以为是定时器的问题,输出数据后发现,数据是每一秒中打印一次没有问题,

经过分析应该是微信小程序没有及时更新页面渲染,导致几秒钟才变更一次

for (let index in t.goodsList) {
  let timeLeave = new Date(t.goodsList[index].endTime).getTime() - new Date().getTime()
  if (timeLeave <= 0) {
    t.goodsList[index].goodhidden = true
    clearInterval(t.cutdownsetIntervalList[index])
    t.cutdownsetIntervalList[index] = null
    return
  }
  t.cutdownsetIntervalList[index] = setInterval(function() {
  if (t.homeTagIndex !== 4) {
    clearInterval(t.cutdownsetIntervalList[index])
    t.cutdownsetIntervalList[index] = null
    return
  }
  t.cutdownTimeList[index] = t.timeCl(t.goodsList[index].startTime, t.goodsList[index].endTime)

  t.$forceUpdate(); //这里让微信小程序强制更新数据就可以解决这个问题


// console.log(t.cutdownTimeList[index]) // 这里输出的数据都会更新

 



这篇关于uni 微信小程序定时器页面不更新的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程