vue better-scroll实现屏幕滚动

官方文档：https://better-scroll.github.io/docs/zh-CN/plugins/

先安装依赖
npm install better-scroll --save

导入

import betters from 'better-scroll'

html代码块

//warpper包着centent，centent只能有一个，内容放在centent里面就行
  <div class="wrapper" ref="wrapper">
    <ul class="content">
    </ul>
  </div>

使用

mounted() {
    const bscroll=new bs(this.$refs.warpper,{
      probeType:2,
      // 0:不侦测
      // 1：非实时（屏幕滑动超过一定时间后）派发scroll (和手机上卸载软件类似)
      // 2：在屏幕滑动的过程中实时派发 scroll
      // 不仅在屏幕滑动的过程中，而且在滚动动画运行过程中实时派发 scroll
      
      click:true,//是否可以监听点击事件
      
      pullUpLoad:true,//是否触发上拉加载更多
      
    })
    //监听滚动
    bscroll.on('scroll',(position)=>{
      console.log(position);
    })
	//上拉触发事件
    bscroll.on('pullingUp',()=>{
      console.log("上拉了");//默认只能触发一次
      setTimeout(()=>{ 
        bscroll.finishPullUp()//这样可以多次触发  写在sertimeout里面是为了防止多次触发（里面写有网络请求的时候）
      },2000)
    })
  }

css(warpper必须要有高度)

.warpper{
  height: 150px;
  background-color: red;
  overflow: hidden;
}