<div class="overlay" v-if="mask" @click="closeMaskTap($event)">
<div class="mask-content" ref="maskContent">
content
</div>
</div>
export default {
data() {
return {
mask: true
};
},
methods: {
closeMaskTap(event){
if (!this.$refs.maskContent.contains(event.target)) {
this.mask = false;
}
}
}
}
.overlay {
position: fixed;
top: 0;
left: 0;
z-index: 99;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.7);
}
