better-scroll插件使用

当我们在制作APP页面的时候，往往需要将内容固定，但是固定后并不能滑动，所以可以借助better-scroll插件来实现滚动。

一、安装better-scroll

npm i better-scroll

二、配置DOM结构

滚动的DOM结构需要有一个父盒子和一个子盒子。

父盒子的高度必须比子元素的高度低才能实现滚动的效果。

<div class="wrapper">
    <div class="content">
        /* 内容 */
    </div>
</div>

三、引入 better-scroll

import BScroll from 'better-scroll'

四、配置better-scroll

const bs = new BScroll('.wrapper', {
  pullUpLoad: true,
  scrollbar: true,
  pullDownRefresh: true
  // and so on
})

注意：在Vue中配置的时候，需要在mounted生命周期中进行配置。