uni-app 在使用popup插件时，滚动弹出框的内容时，遮罩下方的页面也会跟着滚动

最新推荐文章于 2024-12-03 15:08:47 发布
最新推荐文章于 2024-12-03 15:08:47 发布
阅读量5.5k 收藏 2
点赞数 1
分类专栏： mui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wjm0519/article/details/107463934
版权

问题：uni-app 在使用popup插件时，滚动弹出框的内容时，遮罩下方的页面也会跟着滚动

解决方法：在uni-popup 添加代码@touchmove.stop.prevent="moveHandle"

 

最实用最全悬浮Popup 拖动、跟随窗口移动、居中弹出、实时尺寸比例调整、不折叠关闭、截断显示、输入焦点
qq_20758141的博客
06-20 4094
Popup悬浮窗 拖动 跟随窗口移动 居中 实时 比例调整 文本输入框获取焦点
【uniapp学习】解决uni-popup弹出层出现，列表还能滚动
weixin_38673922的博客
02-09 1169
解决uni-popup弹出层出现，列表还能滚动。
uniapp弹窗滚动穿透问题解决
最新发布
ljb376766764的博客
12-03 479
2.在小程序中的滚动穿透可以写上1的方法。也可以直接@touchmove.stop.prevent 但是popup一定要加mode="bottom"不然可能也是无效。以上方法项目实战中亲测有效。1.在h5里面需要在u-popup外面套一个view 写上@touchmove.stop.prevent="stopPrevent"方法：stopPrevent(){
uniapp使用u-popup组件弹窗出现页面还可滑动
weixin_53339757的博客
01-31 3104
解决u-popup出现遮罩层页面滑动问题
uniapp中使用u-popup组件导致的弹框下面的页面可滑动现象
qq_42549017的博客
02-01 2665
同事使用的u-popup组件，然后就有了弹框出来了，但是底下的页面仍然可以滑动，没办法，有问题就解决问题，在网上找了一圈，找的第一种方法，也是看到最多次的方法，但对我没用。于是又花时间找了一圈，找到了一用就好的方法，真的是为了一个bug花费了我老长时间，希望你们不踩坑。步骤一：在main.js中写入两个方法 一个是可以滚动方法 一个是禁止滚动方法。步骤二：在使用弹框的页面调用该方法，在弹窗需要弹出展示前先调用禁止滚动的方法。在关闭弹窗之前调用滚动方法。
解决uniapp 使用打开弹窗后，滚动屏幕，背后的内容也会滚动
qq_52177667的博客
09-14 3132
uniapp
uniapp u-popup封装弹框背景滚动/滚动穿模
weixin_45811884的博客
06-19 528
【代码】uniapp u-popup封装弹框背景滚动/滚动穿模。
uniapp uni-popup弹出层组件 弹窗 无法弹出 自定义样式问题
睡不醒的博客
09-02 8806
uni-popup弹出层组件 之前用到弹出层组件时发现弹出时会有一层灰色的遮罩，后来调试了几次发现是因为没有自定义给弹出层宽高，尝试了几次终于做到自己想要的效果，话不多说，直接附上完整代码： 效果图： <template> <view> <view class="sign_text" @tap="toggle('center')"> <text style="line-height: 60px;margin-top: 12px;">点击弹出&lt
uni-app前端H5页面底部内容被tabbar遮挡
我心坚持
02-16 1173
APP 和小程序的导航栏和 tabbar 均是原生控件，元素区域坐标是不包含原生导航栏和 tabbar 的；而 H5 里导航栏和 tabbar 是 div 模拟实现的，所以元素坐标会包含导航栏和 tabbar 的高度。如果你想在原生 tabbar 上方悬浮一个菜单，之前写 bottom:0。这样的写法编译到 h5 后，这个菜单会和 tabbar 重叠，位于屏幕底部。刚一开始我写在了bottom：0;但是多加padding-bottom可以执行。
uni-app禁止在popup组件中的内容滑动/滚动时触发遮罩层下面的页面滚动
lingliu0824的博客
02-24 4212
解决： 在popup组件的父组件中添加@touchmove.prevent 注意不是在popup组件中添加，而是在其父组件中添加
uni-app弹窗列表滚动, 蒙层下面也跟随滚动解决方案
热门推荐
qq_36576931的博客
10-28 1万+
开发项目时，滑动弹窗里的列表，蒙版下面的内容也会跟着滑动，导致弹窗中的列表不能正常滚动，经过多次百度和多次尝试，终于解决了这个问题，以下代码希望对你有帮助。 1.弹窗组件代码，需要在最外层的view中加入@touchmove.stop.prevent="moveHandle"，且弹窗中需要滚动的列表要使用scroll-view标签包裹起来，且scroll-y 属性不能忘记加。 如对您有...
uniapp 使用 popup 弹出 阴影下内容会滚动
文木博客
04-18 303
【代码】uniapp 使用 popup 弹出 阴影下内容会滚动。
uniapp使用uview ui库的popup或者overlay解决它的底层内容滚动问题
小孩子
03-18 1244
uniapp使用uview ui库的popup或者overlay解决它的底层内容滚动问题
uni-popup safari 遮罩开启后下层页面仍能滚动问题
若尘的博客
05-24 912
uni-popup safari 遮罩开启后下层页面仍能滚动问题
解决uni-popup弹出，页面还能滑动
weixin_59803648的博客
08-29 1823
解决uni-popup弹出，页面还能滑动
【uniapp vue3学习】解决uni-popup弹出层出现，列表还能滚动
qq_34093387的博客
11-27 1588
【代码】【uniapp vue3学习】解决uni-popup弹出层出现，列表还能滚动。
uniapp开发微信小程序之u-popup的滚动条
only_zing的博客
05-29 3007
uView的u-popup设置固定高度，内容超出滚动
uni-app uni-popup弹起后,页面会滚动的问题
加班可以,无偿加班不行
02-23 1357
uni-popup 并不能,完全阻止页面滚动，可在打开 uni-popup 的时候手动去做一些处理，禁止页面滚动,禁止页面滚动
使用uni-popup开发 点击更多条件弹出筛选框
11-01
Uni-app是一个基于Vue.js的框架，用于快速构建跨平台应用，其中uni-popup是官方提供的一款轻量级弹窗组件，可以方便地创建动态的弹出筛选框。当用户点击“更多条件”这样的按钮时，你可以这样做： 1. 首先，在页面...
评论 6
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值