vue 使用Better－Scroll

注意点

1. 外层容器wrapper要设置高度，并且overflow:hidden。

2. wrapper里面的需要一个div包裹所有内容

3. 样式成功

4. 

以上就是可以滚动的情况，wrapperHeight(616) < scrollHeight(750)，hasVerticalScroll为true；

 <template>
   <div class="home">
     <!--定义外层-->
     <div class="wrapper" ref="wrapper">
         <!--定义需要滚动的内容区域-->
         <ul class="content">
             <li v-for="(item,index) in 50" :key="index">hello world hello world</li>
         </ul>
     </div>
   </div>
 </template>

 <script>
 import BScroll from 'better-scroll'
 export default {
   name: 'Home',
   mounted () {
     this.$nextTick(() => {
       this.scroll = new BScroll(this.$refs.wrapper, {})
       console.log(this.scroll)
     })
   }
 }
 </script>

 <style>
 .wrapper{
   position: absolute;
   left: 0;
   top: 40px;
   overflow: hidden;
   height: 500px;
 }
 </style>

参考资料

https://blog.csdn.net/qiqi_77_/article/details/79361413

https://blog.csdn.net/qq_36457584/article/details/80856158