根据各位大佬的解决方案,成功解决苹果13Picker选择器异常问题,下面是解决过程。

问题1描述:

商城添加收货地址时,3级联动选择地址,安卓手机显示,下滑都正常。但是苹果13 16.2版本以上下滑异常,下滑地址时出现跳动,选不中现象。

问题1解决:

分别在mui.picker.js 和 mui.picker.all.js 添加下面代码,判断IOS16.2以上版本webkitTransformOrigin样式不生效。

    if (isIos) {

      if(mui.os.ios && mui.os.plus && plus.os.version >= '16.2'){

        return;

      }

      var maches = userAgent.match(/iphone os ([\d_]+) /i);

      if(maches && maches.length >= 2 && maches[1] >= '16_2'){

        return;

      }

      self.list.style.webkitTransformOrigin = "center center " + self.r + "px";

    }

问题2描述:在在mui.picker.js 和 mui.picker.all.js 添加上面代码后,发现选择正常了,但是选项被遮挡,如下:

问题2解决:

进入mui.picker.all.css文件,注释掉下面两行样式代码:

.mui-picker-inner {

    box-sizing: border-box;

    position: relative;

    width: 100%;

    height: 100%;

    overflow: hidden;

    /* -webkit-mask-box-image: -webkit-linear-gradient(bottom, transparent, transparent 5%, #fff 20%, #fff 80%, transparent 95%, transparent); */

    /* -webkit-mask-box-image: linear-gradient(top, transparent, transparent 5%, #fff 20%, #fff 80%, transparent 95%, transparent); */

}

添加:

.mui-ios-16.mui-ios-16-2 .mui-pciker-list{

  -webkit-transform-origin-x:0 !important;

}

经过测试,添加地址恢复正常,非常顺溜。

再次感谢各位爱分享的大佬们,成功解决过程分享给大家,希望有所帮助!

精彩内容

评论可见,请评论后查看内容,谢谢!!!评论后请刷新页面。