mor7on@qq.com
mor7on@qq.com
  • 发布:2019-01-13 15:56
  • 更新:2020-07-23 11:42
  • 阅读:12715

uni-app div蒙版,如何禁止蒙版下的页面滚动?

分类:uni-app

如题

2019-01-13 15:56 负责人:无 分享
已邀请:

最佳回复

DCloud_UNI_CHB

DCloud_UNI_CHB

方案:给蒙板view增加.stop.prevent事件修饰符,如下:

<view class="mask" @touchmove.stop.prevent="moveHandle"></view>

moveHandle 可以处理蒙版的touchmove实现,或者空实现亦可。

mor7on@qq.com

mor7on@qq.com (作者) - IT

已解决,原来只需要给VIEW组件加一个catchtouchmove="false"就可以了

mor7on@qq.com

mor7on@qq.com (作者) - IT

但是为什么文档中没有这个呢,是不是还有更多的属性没有写在文档中?

choin

choin

我也在找这个,帮大忙了谢谢

mor7on@qq.com

mor7on@qq.com (作者) - IT

还是官方这个方法靠谱,不然控制台报一大串事件出来

sei摸挑

sei摸挑

我加catchtouchmove="false",怎么不管用,另外如果按照官方人员的回答那么做,当前那个元素也不能滚动了啊

lxjnoone

lxjnoone

是给蒙版层 加catchtouchmove="false" 吗 楼主

79229788@qq.com

79229788@qq.com

这个方法仅针对弹出层没有滚动的情况有效,一旦弹出层中包含滚动视图,也无法阻止底层的页面滚动,这个问题好老火

  • sei摸挑

    https://ask.dcloud.net.cn/question/62210 按这里说的我解决了这个问题,你可以试试

    2020-01-06 10:54

  • 79229788@qq.com

    回复 sei摸挑: 不行的,就是给弹出层view加@touchmove.stop.preven="方法",这个方法只对不含有滚动视图的弹出层绝对有效,只要有滚动视图在弹出层内部,就不行了,而且都实验过了,真机,模拟器都不行,我这边是安卓app,我现在临时解决的办法就是H5的惯用方法,弹出层出现时记录页面滚动值,然后用css把页面给fixed,然后利用滚动值做一个top偏移来保持弹出时页面位置正确,当弹出层取消时,恢复所有状态,,有些麻烦,但目前也只能这么做了

    2020-01-06 11:40

  • 79229788@qq.com

    回复 sei摸挑: 其实问题不是在touch move状态,因为滑动弹出层内部的滚动视图时,在滑动期间,页面是不会跟着动的,而是在当滚动视图已经到底部或者顶部时(也就是明明到底了,你还在往底的滑动的话),会自然的拖动底层的页面滚动

    2020-01-06 11:46

  • 79229788@qq.com

    回复 sei摸挑: 对的,我发现我一开始就没有表述清楚,仅针对弹出层内部的滚动视图已经到底了或者到顶了,你继续强行滑动(这种场景很常见,因为你不知道滚动视图有多长,难免发生到底了,还用手滑那么一下),这个时候就会导致页面底部滚动了,所以手指在正常滑动弹出层内部的滚动视图时没有问题的。

    2020-01-06 12:09

  • a1106410836@qq.com

    这个问题你解决没有我也遇到了 没到底部stop 是可以阻止冒泡 可是到了底部或者顶部 继续拖scroll-view 就会直接操作page 烦得很

    2020-01-19 22:26

  • csjgege@qq.com

    大佬你的解决方案可以贴出来看看吗? 我也遇到了,我的弹出层有滚动。谢谢大佬

    2020-02-03 14:42

523244528@qq.com

523244528@qq.com - 慵懒の土豆

蒙版最外层加上 方法

@touchmove.stop.prevent="moveHandle"

moveHandle() {},

如果蒙版内有scroll-view 滑动效果会受到影响

给scroll-view加上 scroll-behavior: smooth; 即可

646028455@qq.com

646028455@qq.com

请问最终这个问题解决了么

1402295276@qq.com

1402295276@qq.com

我只是想问一句,这种问题难道没有官方解决办法吗?一年多了,最终的解决方案是?

  • choin

    最佳回复不是给方案了么

    2020-07-23 11:58

  • 开心_哈哈

    回复 choin:不起作用

    2020-08-20 17:06

要回复问题请先登录注册