zoukankan      html  css  js  c++  java
  • better-scroll刷新后才能滑动的解决方案

    使用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
    }

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

    方法二

    修改 packages/shared-utils/src/dom.ts 中的常量hasTouch

    export const hasTouch = true

    这样就可以在初始化时对参数进行设置,把一切掌握在自己手中

    使用方法如下:

    new BScroll时,在参数options中加入

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

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

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

  • 相关阅读:
    selenium 定位元素的基本方法(6)
    selenium ,先了解html 基础知识(5)
    第 39 章 ThinkPHP--SQL 连贯操作
    第 39 章 ThinkPHP--模型初步(下)
    第 39 章 ThinkPHP--模型初步
    第 39 章 ThinkPHP--模块化和 URL 模式
    CSS属性编写顺序
    Ajax_使用jQuery 实现Ajax
    Ajax_数据格式三大类
    Ajax_使用XMLHttpRequest实现
  • 原文地址:https://www.cnblogs.com/mldonkey/p/11421577.html
Copyright © 2011-2022 走看看