document.body.addEventListener 实现点击页面空白部分关闭弹窗

<div class="order"  @click.stop="ordershow=!ordershow">
点击我显示弹窗
</div>

点击页面空白部分隐藏弹窗

<div class="order-all" v-show="ordershow">
这里是弹窗
</div>


data() {
    
    
    return {
    
    
      ordershow: false,
      }
 }
 
 watch:{
    
    
    ordershow (val) {
    
    
      if (val) {
    
    
        document.body.addEventListener('click', () => {
    
    
          this.ordershow = false
        })
      } else {
    
    
        document.body.removeEventListener('click', () => {
    
    })
      }
    },
  },

猜你喜欢

转载自blog.csdn.net/Ann_52547/article/details/130342534