小程序倒计OA系统

重叠抖动问题

因为请求数据是在onShow函数中写入的，所以每次切换接口时，都会刷新它。如果当前计时器正在运行，这将导致计时器再次刷新。这将导致多个计时器刷新几次。在运行的同时，前端界面上显示的时序号会不时跳转，因此您需要确保只有一个计时器在运行。定时器对象是全局创建的，每次启动定时器时都清除前一个定时器。你可以解决刷新后闪存的问题，或者在标签页中，使用onHide循环清除clearTimeInterval，在非标签页中，使用onUload（）循环清除clearTimeInterval，百度可以找到类似的解决方案，这在我的历史文章小程序战斗步进坑B2B商城项目总结也有一个总结，代码类似如下：

/** *清除间隔* @param */clearTimeInterval:函数（那）{var interval=that.data.interval; clearInterval（interval）}，/** *生命周期函数 - 监听页面卸载*退出此页停止计时器*/onUnload: function（）{var that=this; that.clearTimeInterval（that）}，/** *生命周期函数 - 监听页面隐藏*在后台运行时停止计时器*/onHide: function（）{var that=this; that.clearTimeInterval（that）}

倒计时使用setInterval或setTimeout触摸屏幕导致时间显示的突跳，突慢问题，卡顿，甚至停止

不信的人，你可以尝试用手指触摸屏幕，上下移动一下，你会发现时间已经停止。 （特别是对于低端型号）

通常学生会写这样的代码：

Let self=this; let lefttimeSec=time - new Date().getTime(); let calc=setInterval(function() { lefttimeSec -=1000; self.endtimestr='The distance is over and there is ' + self.dateformat( lefttimeSec); self.$apply(); if (lefttimeSec <=>

After using setInterval, the above-mentioned "小程序 countdown overlap jitter problem" solution is used, which only solves the countdown overlap problem. This way, the accuracy caused by the writing method is not high. In fact, it is very simple, the solution code is as follows:

xx showCountTime（time）{let self=this; setTimeout（function（）{let lefttimeSec=time - new Date（）。getTime（）; lefttimeSec - =1000; self.endtimestr='距离结束，有'+ self.Dateformat（lefttimeSec）; self。$ apply （）; self.showCountTime（time）;}，1000）; }

请注意，此处使用setTimeout。要转到标签页，请使用清除超时清除onHide循环。在非tab页面上，使用onUload（）循环来clearTimeout。这个步骤必须完成，不多说，或者仍然会出现上面提到的“小程序倒计时重叠抖动问题”。

使用上述代码，补偿的准确性不足。仔细测试的学生会发现触摸屏引起的突然跳跃，减慢问题，甚至停止！所以各种各样的想法，去找了很多小程序，京东购物小程序的各种对比。结论是我有很多问题。京东购物倒计时小程序没有这样的问题，给人一种恭维！

问题环境描述：

小程序帧: wepy:'^ 1.7.2'测试模型：红米3

我自己的想法是，wepy脏检查导致触摸（滚动）屏幕下的性能导致一些效率不足。经过进一步测试，我仍然使用Red Rice 3模型，丢弃组件，丢弃数据，只保留数据，并进行简单渲染，页面高度固定，这样屏幕可以上下滑动，代码如下：

{{endtimestr}}

结论是：触摸（滚动）的倒计时是正常的！这也表明wey的脏检查有一些性能缺点，我希望wepy将来会有所改善！