建设网站书,陕西网站建设品牌公司推荐,怎么做百度自己的网站,网站域名详解今天在实现微信小程序的一个横向导航的时候出现了一个问题#xff0c;就是每次滑到滚动条最右边的时候
scrollLeft的值都不准确
原因#xff1a;因为每次滚动监听事件都会被调用比较耗费资源系统会默认节流#xff0c;可以在scroll-view 加一个 throttle“{{false}}” 关闭…今天在实现微信小程序的一个横向导航的时候出现了一个问题就是每次滑到滚动条最右边的时候
scrollLeft的值都不准确
原因因为每次滚动监听事件都会被调用比较耗费资源系统会默认节流可以在scroll-view 加一个 throttle“{{false}}” 关闭节流如下
scroll-view :throttlefalse bindscrollonScroll!-- ... --
/scroll-view但是这种方法会影响性能这是因为关闭节流后,onScroll 事件会在每次滚动时触发,可以提高滚动位置监测的精确度。但需要注意的是,这会增加一定的性能消耗,如果滚动区域很大,滚动频繁,会带来较大的计算压力。所以在复杂场景下,我们还是建议保留系统的节流行为 如果不想消耗过多性能,又想实现精确的滚动监听怎么办 1. 使用节流或防抖来限制onScroll事件的触发频率
// 节流,100ms内只触发一次
onScroll: _.throttle(function(e) {//...
}, 100) // 防抖,滚动结束500ms后触发
onScroll: _.debounce(function(e) {//...
}, 500) 2. 只在特定情况主动获取滚动值:
滚动开始时获取一次滚动结束时获取一次滚动到边界时获取一次通过wx.createSelectorQuery()主动获取滚动值,只在需要精确值时触发 onScrollStart() {this.getScrollTop()
}onScrollEnd() {this.getScrollTop()
} onScroll() {if(达到边界) {this.getScrollTop()}
}
