better-scroll学习笔记

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

①DOM层级
<div class="wrapper">
<ul class="content">
<li>...</li>
<li>...</li>
...
</ul>

</div>
better-scroll 是作用在外层 wrapper 容器上的，滚动的部分是 content 元素。这里要注意的是，better-scroll 只处理容器（wrapper）的第一个子元素（content）的滚动，其它的子元素都会被忽略。

代码初始化方式为：
let wrapper = document.querySelector('.wrapper')
let scroll = new BScroll(wrapper)

②滚动原理
content层（子级）的高度必须大于wrapper层（父级）的高度，才会产生滚动效果（同浏览器默认的滚动效果一样）。
例：wrapper层高度设为100%，那么content层的高度最少为101%，才会产生上拉下滑的滚动效果