介绍

1. BetterScroll 是一款重点解决移动端（已支持 PC）各种滚动场景需求的插件。它的核心是借鉴的 iscroll (opens new window)的实现，它的 API 设计基本兼容 iscroll，在 iscroll 的基础上又扩展了一些feature以及做了一些性能优化。

2. BetterScroll 是使用纯 JavaScript 实现的，这意味着它是无依赖的。

---

在Vue中安装

1. 使用 npm在项目中安装:

npm install better-scroll --save

better-scroll实现移动端流畅滚动

在Vue项目中简单使用

1. 使用 VueCLI3以上的脚手架创建一个Vue项目：

vue create better-scroll-demo

2. 在项目中安装better-scroll :

npm install better-scroll

3. 编写页面结构:这里的页面结构是由一定要求的，.wrapper类包裹的元素只能是一个标签。这里的.wrapper类名是自定义的，注意后面跟随一致。

 <div class="wrapper">
    <div class="hello">
      <ul>
        <li>列表1</li>
        <li>列表2</li>
        <li>列表3</li>
        <li>列表4</li>
        <li>列表5</li>
        <li>列表6</li>
          ....这里省略若干行
      </ul>
    </div>
  </div>

4. 编写页面样式:

.wrapper {
    height: 300px;
    background-color: skyblue;
  }

5. 在mounted生命周期函数中创建 Better-scroll对象并绑定需要实现滚动的页面元素。

new BS('.wrapper', {})