<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); }