注册登录

未尛2333

发布：2019-04-10 14:03
更新：2019-10-18 10:22
阅读：10536

uni-app 蒙层穿透

分类：uni-app

uniapp

当使用遮罩层时给遮罩层加上@touchmove.stop.prevent="" 但是点击空白区域还是可以使下面被遮罩的内容产生滑动

下方demo 使用ios 将遮罩层内容拉到最下方，然后点击空白区域会使下面的内容产生滑动

2019-04-10 14:03 负责人:无分享

5 个回复

[已删除]

其实直接@touchmove.stop.prevent就行了不需要=“”

未尛2333 (作者)

不行啊我不知道你试了demo没有你自己试着手指触摸到白色部分然后向上拉到就知道可不可以了

2019-07-11 16:27

DCloud_heavensoft

可以看下hello uni-app的代码，里面有弹出层，没有穿透问题

未尛2333 (作者)

我刚刚试了下 hello里面的如果遮罩层下面的页面有滚动条产生，按住遮罩层白色部分，页面还是可以发生滚动的

2019-04-10 16:48
未尛2333 (作者)

谢谢~可以给最外层的父级加overflow: hidden;可以解决掉这个问题。

2019-04-10 16:54

取舍 - 我们都如流星短暂但谁能像它闪耀

给他一个空函数试试啊

未尛2333 (作者)

试了也不行 ios的

2019-04-11 13:45
未尛2333 (作者)

问题解决了就行

2019-04-11 13:46

1***@qq.com - 不待

这个怎么解决啊

未尛2333 (作者)

当弹框出现的时候你给最外层的父级一个overflow: hidden，然后等弹框消失的时候把overflow: hidden;去掉就可以了

2019-07-11 10:15
lxb

回复未尛2333: 这个最外层弹窗是指page元素吗

2019-09-11 20:29
未尛2333 (作者)

回复 lxb: 非弹框的

2019-09-12 17:45
4***@qq.com

回复未尛2333: 但是这样页面会滚动到最顶部

2021-11-18 17:00

4***@qq.com

除了“@touchmove.stop.prevent”再加上“@touchend.stop”，只加“@touchmove.stop.prevent滑动是禁了，但是点击的时候，蒙层下面的列表会自动滚动

未尛2333 (作者)

感觉不是@touchend吧主要是一直按着空白的地方也可以滚动

2019-11-11 16:56
4***@qq.com

回复未尛2333: 我知道点空白的还是会滚动，但是你在有空白的地方搞一个宽高100%的绝对定位view，z-index:0的，加上我这个，就不会滚动

2020-03-17 18:00
4***@qq.com

回复未尛2333: 你蒙层上面最外层的view不要给padding，需要padding的话在子view加

2020-03-17 18:02

该问题目前已经被锁定, 无法添加新回复