zoukankan      html  css  js  c++  java
  • vux中的 scroller 组件,在iOS13上,一停止滑动就跳到顶部问题

    bug出现的原因

    1、发现是ios13上面获取transform的结果跟老版本的结果不一样:

    // 老版本:
    'matrix(1, -2.4492935982947064, 2.4492935982947064, 1, 0, 19.48200035095215)'
    
    //新版本
    'matrix(1, -2.4492935982947064e-16, 2.4492935982947064e-16, 1, 0, 19.48200035095215)'

    2、在node_modules -> vux-xscroll -> build -> cmd -> simulate-scroll.js下的getScrollTop方法如下:

    getScrollTop: function() {
      var transY = window.getComputedStyle(this.container)[transform].match(/[-\d\.*\d*]+/g);
      return transY ? Math.round(transY[5]) === 0 ? 0 : -Math.round(transY[5]) : 0;
    }

    该方法校验transform的正则( /[-\d\.*\d*]+/g  )不能满足新版本,所以匹配最新版本的ios会出现得到 

    transY  = ["1", "-2.4492935982947064", "-16", "2.4492935982947064", "-16", "1", "0", "19.48200035095215"]的结果。
    getScrollTop得到的返回值为-Math.round(transY[5]) 的时候永远为-1,这也就是为什么获取到的scrollTop的值总是会变成-1。

    解决办法:

    将node_modules -> vux-xscroll -> build -> cmd -> simulate-scroll.js下的getScrollTop方法里面的正则表达式替换成下面(/[-\d\.*\d*e\-\d]+/g )的就可以了。

    getScrollTop: function() {
      // var transY = window.getComputedStyle(this.container)[transform].match(/[-\d\.*\d*]+/g);
      var transY = window.getComputedStyle(this.container)[transform].match(/[-\d\.*\d*e\-\d]+/g);
      return transY ? Math.round(transY[5]) === 0 ? 0 : -Math.round(transY[5]) : 0;
    } 
  • 相关阅读:
    springboot配置tomcat大全
    python 列表推导式
    python中yield的用法详解——最简单,最清晰的解释
    正则表达式
    python 装饰器
    python 接口类、抽象类、多态
    python split和os.path.split()
    pyhton 多继承的执行顺序
    python unittest 加载测试用例的方法
    python unittest中的四个概念
  • 原文地址:https://www.cnblogs.com/zjianfei/p/14630328.html
Copyright © 2011-2022 走看看