@click.stop:用于阻止冒泡
@click.stop 标签范围内,点击任何区域(包括 @click 点击事件)都不会关闭弹窗。标签范围外会关闭弹窗
@click.stop 标签内的 @click 等事件:如果事件内有关闭弹窗的代码可关闭弹窗文章来源:https://www.toymoban.com/news/detail-732742.html
在 template 中
<view class="pop-box" v-if="showPop" @touchmove.stop.prevent="toMoveHandle" @click="showPop = false">
<view @click.stop>
弹窗内容
</view>
</view>
<view @click="showPop = true">打开弹窗</view>
在 script 中
data() {
return {
showPop: false,
}
}
toMoveHandle 方法请查看:uniapp 禁止遮罩层下的页面滚动文章来源地址https://www.toymoban.com/news/detail-732742.html
在 style 中
.pop-box {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.4);
z-index: 999;
}
到了这里,关于uni-app 点击蒙版层时关闭自定义弹窗的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!