better-scroll 网络数据过慢,不能滚动问题
Posted hellowoeld
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了better-scroll 网络数据过慢,不能滚动问题相关的知识,希望对你有一定的参考价值。
1、原因:
网络比较慢,请求的图片比较多,,导致图像的高度没有实际的显示,因此better-scroll计算不上图像的高度,因此导致BScroll无法正常滚动。
2、解决方法 一
在vuex定一个变量,给加载的图片添加load事件,每一次加载完成后改变vuex中的变量,在页面中监听vuex中该变量的变化,每一次变化都执行this.$refs.scroll.refresh()
代码:
1、vuex
state: { itemImgLoad:0 }, mutations: { setItemImgLoad(state){ state.itemImgLoad=state.itemImgLoad+1 } },
2、图片组件
<img :src="goodsItem.show.img" @load="imgLoad"> methods:{ imgLoad(){ this.$store.commit(‘setItemImgLoad‘); } }
3、父页面
computed: { watchVuex() { return this.$store.state.itemImgLoad; } }, watch: { // 监听vuex(数据变化) watchVuex() { // 重新渲染 this.$refs.scroll.refresh(); } },
以上是关于better-scroll 网络数据过慢,不能滚动问题的主要内容,如果未能解决你的问题,请参考以下文章
better-scroll中嵌套原生滚动组件,原生滚动组件失效问题