vue.js点击弹窗以外的区域关闭弹窗
点击弹窗外的区域关闭弹窗代码结构html:<div class="publish_mask_popup" @click="hideMaskPopup" v-show="showMaskPopup"><div class="mask_popup">内容代码.....</div></div>js:data(){showMaskPopup:false},m
·
点击弹窗外的区域关闭弹窗
代码结构
html:
<div class="publish_mask_popup" @click="hideMaskPopup" v-show="showMaskPopup">
<div class="mask_popup">
内容代码.....
</div>
</div>
js:
data(){
showMaskPopup:false
},
methods: {
hideMaskPopup(e){
let mask = document.querySelector(".mask_popup");
if (mask) {
if (!mask.contains(e.target)) {//判断所点击的区域是否在.mask_popup中
this.showMaskPopup = false;
}
}
}
},
实现效果:
更多推荐
已为社区贡献8条内容
所有评论(0)