vue2.0点击其他任何地方隐藏dom

methods: {
    handleBodyClick(){
        if (绿色区域出来了，要判断点击其他地方就要关闭，这样可以避免绿色区域已经关闭还在操作) {
          let _con = $(目标区域)
          if (!_con.is(e.target) && _con.has(e.target).length === 0) {
            // 点击目标区域外的时候关闭绿色区域
          }
        }
    },
},
mounted () {
  document.addEventListener('click', this.handleBodyClick)
},
destroyed () {
  document.removeEventListener('click', this.handleBodyClick)
}

原文参考《vue点击其它任何地方隐藏dom》

另外有一种隐藏整个组件的,比较适合一个弹出层是一个组件的情况

  mounted () {
    document.addEventListener('click', this.handleDocumentClick)
  },
  methods: {
    handleDocumentClick (e) {
      if (!this.$el.contains(e.target)) {
        this.isShow = false
      }
    }
  },
  destroyed () {
    document.removeEventListener('click', this.handleDocumentClick)
  }