滚动原理：
浏览器的滚动条：
当页面内容的高度超过视口高度的时候，会出现纵向滚动条；当页面内容的宽度超过视口宽度的时候，会出现横向滚动条。也 就是当我们的视口展示不下内容的时候，会通过滚动条的方式让用户滚动屏幕看到剩余的内容。
注意：
我们在初始化它的时候，必须确保父元素和子元素的内容已经正确渲染了。
如果子元素或者父元素 DOM 结构发生改变的时候，必须重新调用 scroll.refresh() 方法重新计算来确保滚动效果的正常。
在vue中的用法：
1.在github中找到并安装第三方插件
npm install better-scroll --save
2.在vue中模块中引入
<template>
<div class="wrapper" ref="wrapper">
<ul class="content">
<li>...</li>
...
</ul>
</div>
</template>
<script>
import BScroll from 'better-scroll'
export default {
mounted() {
this.$nextTick(() => {
this.scroll = new Bscroll(this.$refs.wrapper, {})
})
}
}
当 probeType 为 1 的时候，会非实时（屏幕滑动超过一定时间后）派发scroll 事件；
当 probeType 为 2 的时候，会在屏幕滑动的过程中实时的派发 scroll 事件；
当 probeType 为 3 的时候，不仅在屏幕滑动的过程中，而且在 momentum 滚动动画运行过程中实时派发 scroll 事件。
如果没有设置该值，其默认值为 0，即不派发 scroll 事件。