在我们的开发中，用vue开发移动端时，如果使用原生滚动的话，在模拟器上面不会出现什么问题，但到了真机上面就会出现滑动不流畅的问题。那么我们可以使用滑动插件来解决这个问题，下面我们来说一下betterscroll这个滑动插件
betterscroll是目前比较好用的一个滑动插件，但是第一次使用的时候总会出现一些问题，使得betterscroll无法达到预期的使用效果，下面就来说一下我觉得会出现的问题
1.页面不能滚动，但可以使用原生滚动
出现这个问题的原因可能是没有设置固定的滚动区域高度
<div class="wrapper"><div class="content"><slot></slot></div></div>在BetterScroll的官方文档里，wrapper是父容器，要有固定的高度，content是用来放可滚动内容的，当content里的内容高度大于wrapper高度就可以实现滚动了，注意这里的高度不能直接写100%，除非它的父级，或者整个页面有固定的高度（100vh）
2.可以滚动，但是滚动一下又不能继续往下滚动
出现这个问题的是：可滚动高度还没有来的及刷新页面已经构建完成了
我们往滑动区域里面添加一些从网络请求下来的东西，但网络请求可能比较慢，还没有请求完成，但页面已经构建完成了，这个时候的可滑动高度是按构建完成时的高度来算的，后面请求来的东西是加进页面里面了，但是可滑动高度还是按页面构建完成时的高度来算的，也就是后面加进来的东西是不能滑动的。
解决方法：
方法一：如果页面加载图片比较多，可以监听图片加载完成，在刷新滑动高度（重新计数可滑动高度）
<div class="wrapper"><div class="content"><img :src="i" alt="" class="detailImage" style="width: 100%" @load="imgLoad"></div></div>data(){return{num: 0,imgLength:0}},watch:{//监听数组变化detailInfo(){this.imgLength = this.img.list.length},}methods:{refresh(){// 重新计数滑动高度this.scroll && this.scroll.refresh()},imgLoad(){//判断图片加载完进行一次回调（最后一张图片加载完成时回调）if(++this.num === this.imgLength){this.refresh()}}},注意：（这只是代码片段）代码不完整，复制应该不能运行
方法二：
直接监听数组变化，数组有变化就刷新可滑动高度，（不建议使用这种方法，因为数组一变化就刷新，刷新太频繁会影响性能）。
方法三：
监听下拉事件，下拉刷新可滑动高度，
3.完全无法滚动
出现这个问题的原因可能是可滑动高度小于固定的滚动区域高度。