700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > 小程序:防止点击遮罩层后遮罩层下面也反应的操作

小程序:防止点击遮罩层后遮罩层下面也反应的操作

时间:2020-08-25 16:54:43

相关推荐

小程序:防止点击遮罩层后遮罩层下面也反应的操作

微信小程序|小程序开发

小程序

微信小程序-小程序开发

网站下载器源码,vscode元素样式提示,使用ubuntu很卡,tomcat支持多个证书,麂皮爬虫,php 支付宝 签名验证,徐汇seo优化哪里有,在线免费算命网站源码,帝国 ecms081模板lzw

本篇文章给大家带来的内容是关于小程序:防止点击遮罩层后遮罩层下面也反应的解决方法,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

站群蜘蛛池源码,vscode哪个好用ide,pase.ubuntu,tomcat书籍推荐豆瓣,雨后爬虫,php 数字 补0,无锡seo推广哪家好,个人博客网站模板百度云,手机微网站模板免费下载lzw

最近在做自定义弹窗,不免会使用到遮罩层或者说蒙层。

glib源码下载,ubuntu拷贝文件路径,tomcat设置下载文件,行业信息爬虫,php后端难学吗,无锡seo优化网络推广十大排名lzw

但是关键是,有遮罩层后,再点击遮罩层下的组件,依然会产生点击事件。

那如何解决这个问题呢 ?

网上给出了几种方法

1 . 在遮罩层 view 中添加 catchtouchmove 点击事件。因为 catch 事件绑定可以阻止冒泡事件向上冒泡。

2 . 给底层页面动态添加 position:fixed;

小程序弹出层点击穿透问题

通过实践,网上说的前面两种是不可行的,对于第一种,不知是不是我姿势不对!第二种纯属坑蒙拐骗!或者说他的项目能行是机缘巧合。

下面介绍的这种方法倒是非常不错。

3 . 使用 wx:if 和 wx:else 或 hidden 控制显示。当弹出遮罩层时,不显示组件。

至于使用 wx:if 还是 hidden,一般来说,wx:if 有更高的切换消耗而 hidden 有更高的初始渲染消耗。因此,如果需要频繁切换的情景下,用 hidden 更好,如果在运行时条件不大可能改变则 wx:if 较好。可以参考官方文档的说明。

这里简单的说一下遮罩层的样式

/* 遮罩层 */.mask{ width: 100%; height: 100%; background: #000; opacity: 0.5; z-index: 9000;}

项目地址:/MoTec95/CustomPop

微信小程序实例:分享给一个人还是分享到群的判断代码

微信小程序在上传图片时如何限制大小(附代码)

小程序:如何动态增加删除JSON对象数组(附代码)

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。