官方文档是这样解释的:
refresh()
参数:无
返回值:无
作用:重新计算 better-scroll,当 DOM 结构发生变化的时候务必要调用确保滚动的效果正常。
我的理解是,这个方法的使用场景大概分为以下几种
1.DOM树结构改变时
2.需要展示的内容大于scrollerHeight和wrapperHeight时
3.图片列表等展示形式中 图片加载完成时
this.scroll.refresh()
对于refresh非常频发的问题,进行防抖操作
·防抖debounce/节流throttle
·防抖函数的起作用的过程
1.可以将refresh函数传入到的debounce函数中 生成一个新的函数
2.之后再调用非常频繁的时候,使用新生成的函数
3.而新生成的函数,并不会非常频繁的调用,如果下一次执行来的非常快,那么会将上一次的取消掉
<script>
mounted(){
this.$bus.$on('itemImageLoad',()=>{
const refresh=this.debounce(this.$refs.scroll.refresh,500)
refresh()
})
},
methods: {
//定义防止刷新频繁的防抖函数,可优化性能
debounce(func,delay){
let timer = null
return function(...args){
if(timer) clearTimeout(timer)
timer=setTimeout(()=>{
func.apply(this,...args)
},delay)
}
},
}
</script>