【五】scroll组件

关于专题【vue开发音乐App】 开发页面时，如果想让某个区域支持滚动（或者需要监听滚动事件），一般会使用better-scroll——一款重点解决移动端（已支持 PC）各种滚动场景需求的插件，作者依然是黄轶老师，具体使用方法和例子可查看官方文档。 学习《Vue.js高仿饿了么 》 时第一次接触better-scroll ，在使用该插件的过程中，发现实现步骤、逻辑基本一致，如果能固化这些步骤抽象成自定义组件（ scroll.vue，类似于微信小程序的scroll-view组件 ），日后再有类似的滚动需求，直接调用即可，这样也使代码更简洁高效且易于维护。 首先需要安装better-scroll，执行命令：cnpm i better-scroll -S 一、 src/base/scroll/scroll.vue 二、使用方法

• ...

三、常见问题及处理 如果better-scroll不能滚动，可能是因为滚动元素的DOM未渲染成功，better-scroll计算不了滚动元素的高度，从而失效； 如果滚动数据或DOM发生变化，一定要执行better-scroll的refresh; 当better-scroll和fastclick在点击事件上有冲突，可以为目标元素添加fastclick提供的“needsclick”样式类解决。

本文章由javascript技术分享原创和收集