better-scroll 遇到的那些坑

前言

恕我直言，用好 better-scroll 这个插件，比用好vue还难。此篇为本人的踩坑点，持续更新。

1. 子元素撑开父元素使其不能滚动

• BUG原因：

  在 better-scroll 中，子元素必须比父元素高（宽）才能让子元素在父元素内实现滚动

• 解决方法：

  给父元素定位，并设置 height:100%

2. better-scroll 嵌套时，多次触发onCLick事件

• BUG原因：

  better-scroll 多次创建实例引发的问题，多次绑定 onClick 事件使其重复执行

• 解决方法：

  此时用 fastclick 模拟 onclick 事件即可解决，顺带还能解决 300ms 延迟：

  1. 安装 fastclick 依赖（示例为react开发场景）

     yarn add react-fastclick

  2. 引入 initReactFastclick

     import initReactFastclick from 'react-fastclick'
     

  3. 执行

     initReactFastclick();