在移动端开发中使用到了Mint-ui组件库，其中有两个组件Popup组件和DatetimePicker存在滚动性穿透问题，官方文档最新版并没有解决这个问题。现象还原官方地址手机扫码查看demo，查看两个组件Popup组件和Datetime的例子演示。问题原因HTML5触摸事件touchmove事件：当手指在屏幕上滑动的时候连续地触发所以当激活出组件Popup组件和DatetimePicker的弹出层时，我们在弹层选择内容时上下连续滑动是会触发该事件解决思路在弹出层出现之...
继续阅读 >
分类：滚动穿透
2020
09-29
09-29
Vue项目移动端滚动穿透问题的实现
概述今天在做Vue移动端项目的时候遇到了滚动穿透问题，在网上查资料后，选取了我觉得最好的方法，记录下来供以后开发时参考，相信对其他人也有用。上层无需滚动如果上层无需滚动的话，直接屏蔽上层的touchmove事件即可。示例如下：<div@touchmove.prevent>我是里面的内容</div>上层需要滚动如果上层需要滚动的话，那么固定的时候先获取body的滑动距离，然后用fixed固定，用top模拟滚动距离；不固定的时候用获取top的...
继续阅读 >