vue3实现遮罩层外部禁止页面滚动,内部可滚动
方法一:直接在遮罩层添加
@touchmove.prevent
,就可以实现禁止页面滚动,但是同时遮罩层内部也无法滚动了,适用于内部不需滚动的场景。
方法二:(此方法可以实现需求,但是关闭遮罩层后主页面会滑动到顶部,无法回到原来的浏览位置)
1 | function mo = function(e){ |
方法三:(推荐:此方法不仅可以实现需求,还会记录打开遮罩层时的位置,使关闭后仍然停在原来的位置)
1 | // 记录页面滚动位置 |
- 标题: vue3实现遮罩层外部禁止页面滚动,内部可滚动
- 作者: JiangWen
- 创建于 : 2020-02-28 12:15:00
- 更新于 : 2024-11-24 17:45:51
- 链接: https://blog.jiangwen.site/2020/02/28/Vue/vue3实现遮罩层外部禁止页面滚动,内部可滚动/
- 版权声明: 本文章采用 CC BY-NC-SA 4.0 进行许可。
推荐阅读
评论