关于better-scroll的使用

better-scroll手机模式下刷新才能滚动
可以实现下拉刷新、上拉刷新、吸顶操作、防止回弹等效果。

1、安装better-scroll

npm install better-scroll --save

2、引入

import BScroll from ‘better-scroll’

3.下面是实现的最普通的滚动，只是一个例子：

  <div class="wrapper" ref="wrapper">
        <ul class="content">
            <li>3</li>
            <li>3</li>
            <li>4</li>
            <li>5</li>
            <li>6</li>
            <li>1</li>
            <li>2</li>
            <li>3</li>
            <li>4</li>
            <li>5</li>
            <li>6</li>
            <li>7</li>
            ...
        </ul>
    </div>
    mounted(){
    
    
     mounted() {
    
    
            const options = {
    
    
               probeType:3,
               bounce:false,
               click:true,
               mouseWheel: true,//开启鼠标滚轮,
                //    disableTouch: false
              
            };
            this.$nextTick(() => {
    
    
                this.betterScroll = new BScroll(this.$refs.wrapper, options)
                console.log( this.betterScroll);
              this.betterScroll.on('scroll',(pos)=>{
    
    
              console.log("滚动了");
              console.log(pos);
      })
     .wrapper{
    
    
    width: 100vw;
     height: 100vh;// 一定要给父容器固定高度，让子元素超过其高度。
    }

可以参照这位大佬文章：地址