vue 点击弹窗外区域隐藏弹窗

mounted() {
    this.$nextTick(function() {
      document.addEventListener("click", e => {
        this.closeBox(e);
      });
    });
  },
  // 销毁document的点击事件
  beforeDestroy() {
    document.removeEventListener('click', e => {
      this.closeBox(e);
    });
  }

<div class="mu-popover dishTypeCont" v-if="dishTypeTreeVisible">
      <div ref="addDemandBox">xxx</div>
</div>

methods:{
	closeBox(e){
		const addDemandBox = this.$refs.addDemandBox;
		if (addDemandBox && !addDemandBox.$el.contains(e.target)) {
	        this.addDemandDialog = false;
	      }
	}
}

注意：

1.监听需要清除，否则控制台会报错，虽然不影响使用

2.一般判断需要判断需要关闭的元素和开启这个元素的按钮

3.ref替代了jquery和js的dom选择，当不适用vue的时候可以直接使用dom选择器完成以上操作

菜鸟教程：
对于contains方法的使用