在定时函数中 多次执行setData改变样式 页面不及时刷新
发布于 5 年前 作者 linwei 11021 次浏览 来自 问答

最近做一个歌词滚动的功能，要求同一行歌词，不同的文字渐变颜色时有不同的速度。

我使用是setInterval 不断的setData 去更改数据从而达到动态的更改样式的效果，在模拟器上完美运行。

在真机不滚动歌词的情况下没问题，但是一旦滚动歌词（scroll-view）然后不动 。这时渐变就不渲染。

然后继续不停的滚动歌词就可以按正常的渲染执行了

执行一会就报了一个警告:[Violation] ‘setInterval’ handler took 70ms

有哪位大佬知道这是为什么呢 ，官方大佬请出来说两句, 在线等急。。。。。。

7 回复

setData是一个异步的操作，此外https://developers.weixin.qq.com/miniprogram/dev/framework/performance/tips.html?search-key=优化

用这种方式就算实现了性能也很差，建议用canvas。

实在要用这种方式的话，可以用css animation实现渐变，setData控制每行的class和animation-duration；也能把setData的频率降低到每行一次。

我遇到的是滚动页面到相关标题，吸顶导航对应的标题显红色，用了setData来渲染改变样式，由于滑动速度太快，总是出现延迟，一直找不到好的方法

在你的JSON配置文件中加入这行代码试试：

  "usingComponents": {}

官方不建议频繁调用setData

能发个代码片段看看么，滚动时无法渲染是由于webview在滚动时对内容渲染做的限制。而你的setData没有停止，所以出现无法继续渲染的问题。可以在滚动时终止setData，滚动结束后重新计算需要渲染的位置继续开始setData

来人啊，有哪位大神出来解答了，我重重有赏。

回到顶部