移动端-vue-BScroll用法教程

简介

BetterScroll 是一款重点解决移动端（已支持 PC）各种滚动场景需求的插件，是最接近与原生的滚动插件，兼容pc和移动端。

官网

https://better-scroll.github.io/docs/zh-CN/

安装

npm install better-scroll --save

使用

import BScroll from "better-scroll";

let bs = new BScroll('.wrapper', {
   scrollbar: true,//是否显示滚动条
   bounce: true, //回弹动画
   click: true,//派发点击事件
   scrollX: false, //是否横向滚动
})
 bs.on("pullingDown", async () => {
   //下拉刷新      
   //当使用监听事件下拉刷新，但是pullingDown回调完函数，要在最后添加finishPullDown(); 
   // 作用是事情做完，需要调用此方法告诉    better-scroll 数据已加载，否则下拉事件只会执行一次
  bs.finishPullDown();
  bs&& bs.refresh(); //重新计算 BetterScroll
 });
 bs.on("pullingUp", async () => {
 //上拉加载
 //上拉同理与下拉，否则上拉事件只会执行一次。
     bs.finishPullUp();
     bs&&bs.refresh(); //重新计算 BetterScroll
 });

移动端列表滚动使用