当前位置: 首页 > 工具软件 > BetterScroll > 使用案例 >

Better Scroll不能滚动问题

王航
2023-12-01

最近在学Vue框架,在初始化Better Scroll插件时遇到了内容不能滚动的问题。
于是在网上搜了几下大概了解到Better Scroll只有在内容高度大于容器高度时滚动。Better Scroll的容器里内容如果是ajax异步获取的,在获取数据之前初始化了Better Scroll就会导致内容高度比容器高度小,从而不会滚动。记录一下两种解决办法。

1.我们只需用watch监听获取的数据,然后里面运行一下this.scroll.refresh()就能解决。

mounted () {
	this.scroll = new Bscroll(this.$refs.wrapper)
},
watch: {
    cities () {
    	this.$nextTick(() => {
			this.scroll.refresh();
        })
    }
}

2.直接在setTimeout里实例化Better Scroll,这样可以先获取完数数据,有了内容高度大于容器高度前提,就可以滚动。

setTimeout(()=>{
	this.scroll = new Bscroll(this.$refs.wrapper)},0)
 类似资料: