标签：lan 位置 ted 分割 去掉 mic 更新 poll ons
better-scroll是一个页面滚动插件，用它可以很方便的实现下拉刷新，锚点滚动等功能。
实现原理：父容器固定高度，并设置overflow：hidden，子元素超出父元素高度后将被隐藏，超出部分可滚动且没有滚动条。
<body> <div id="wrapper"> <ul> <li>...</li> <li>...</li> ... </ul> </div> <script type="text/javascript" src="better-scroll.js"></script> <script type="text/javascript"> new BScroll(document.getElementById(‘wrapper‘)); </script> </body>
npm install better-scroll
import BScroll from ‘better-scroll‘
var BScroll =
<div id="wrapper" ref="wrapper"> <ul class="container"> <li>...</li> <li>...</li> ... </ul> </div>
_initScroll() { this.boxScroll= new BScroll(this.$refs.wrapper, { click: true }) },
注意：
better-scroll会将点击事件去掉，如果滚动部分需要有点击事件，需要在参数里加上click：true。
同时，在PC上或某些手机端，由于未成功将touchend事件move掉，点击事件会执行两次。
better-scroll派发的event事件和原生js的event有属性上的区别，其中有一个属性为event._constructed。better-scroll派发的事件中event._constructed为true，原生点击事件中没有这个属性。
selectList(index,event){ if(!event._constructed){//如果不存在这个属性,则为原生点击事件，不执行下面的函数 return } }
由于vue中数据更新是异步的，在dom解构没有加载完成，BScroll无法获取目标容器的高度，会出现无法滚动的现象。
vue中有一个方法可以解决这个问题：$nextTick()
根据官方API的解释可知，一些需要在页面数据变化完成后才执行的函数需要写在$nextTick中 。
this.$nextTick(() => { this._initScroll() })
参考网站：
https://www.npmjs.com/package/better-scroll better-scroll文档
https://github.com/ustbhuangyi/better-scroll github
better-scroll的用法，及其中的一个属性event._constructed详解
标签：lan 位置 ted 分割 去掉 mic 更新 poll ons
原文地址：http://www.cnblogs.com/yi0921/p/7206549.html
