better-scroll刷新后才能滑动的解决方案

Posted 2022-09-03 mldonkey

使用cube-ui时鼠标滚轮无法使用,且老触发无法滑动的bug,我十分困惑,于是分析了scroll组件,发现better-scroll才是关键.

于是我赶紧看了看better-scroll的文档.发现鼠标滚轮是可以开启的.开启之后终于可以愉快的使用鼠标滚轮了.

mouseWheel: true,//开启鼠标滚轮

 

使用better-scroll,在chrome浏览器测试代码,切换手机模拟器之后,就会出现刷新后才能滑动的"bug".这个问题困扰了我半天,上网搜了很久也没有找到很好的解决方案.

几番测试之后,我怀疑是touch事件没注册导致的,为了验证我的猜想,我把源码下载下来并分析,终于让我找到了解决关键代码,真是皇天不负有心人啊

 

在 better-scroll 的源码 packages/core/src/base/ActionsHandler.ts 中:

const shouldRegiserTouch = hasTouch && !disableTouch
const sholdRegisterMouse = !disableMouse

这两个是确定是否需要注册触摸事件和鼠标拖动事件的常量.

这里可以进行改动,将其改为变量,判断当前是否为开发环境,如果是开发环境,就把这两个变量都设置为true,就行了

let shouldRegiserTouch = hasTouch && !disableTouch
let sholdRegisterMouse = !disableMouse
if(process.env.NODE_ENV===‘development‘) 
  shouldRegiserTouch = true
  sholdRegisterMouse = true

经过测试之后果然行得通,但是总修改源码也不是办法.....

 

几经周折,我发现其实可以在初始化时对参数进行设置,以下是最终解决方案

new BScroll时,在参数options中加入

mouseWheel: true,//开启鼠标滚轮
disableMouse: false,//启用鼠标拖动
disableTouch: false//启用手指触摸

O(∩_∩)O哈哈~又可以愉快的调试了,妈妈再也不用担心我滑不动屏幕了

 

原文链接:https://www.cnblogs.com/mldonkey/p/11421577.html