vue 除某元素外點擊 觸發事件

自定義指令 

directives: {
    clickoutside: { // 初始化指令
      bind(el, binding, vnode) {
        function documentHandler(e) {
          // 這裏判斷點擊的元素是否是本身，是本身，則返回
          if (el.contains(e.target)) {
            return false;
          }
          // 判斷指令中是否綁定了函數
          if (binding.expression) {
            // 如果綁定了函數 則調用那個函數，此處binding.value就是handleClose方法
            binding.value(e);
          }
        }
        // 給當前元素綁定個私有變量，方便在unbind中可以解除事件監聽
        el.__vueClickOutside__ = documentHandler;
        document.addEventListener('click', documentHandler);
      },
      update() {},
      unbind(el, binding) { // 解除事件監聽
        document.removeEventListener('click', el.__vueClickOutside__);
        delete el.__vueClickOutside__;
      }
    }
  }

 dom上使用

<div v-clickoutside="fun"></div>

 除這個div外 其他元素點擊都會觸發fun事件