点击边界隐藏

帮xmj的组看自定义组件的时候，遇见这么一个问题 点击输入框之外的区域，隐藏下拉框 最开始是找到element源码研究 后面发现其实就是判断你点击的dom元素是否是指定该节点的后代 elment是使用的Node.contains()api 所以就这么改

created(){
    document.addEventListener('click', (e) => {
             if (this.$refs.treeSelect) {
               let isRefs = this.$refs.treeSelect.contains(e.target)
               if (!isRefs) {
                 this.searchBox = false
               }
             }
           }) 
}
 

因为他们组封装和规范问题修改成

mounted(){
    window.addEventListener('mouseup', this.mouseupInput);
}

methods:{
   mouseupInput(){
       if (this.$refs.treeSelect) {
          let isRefs = this.$refs.treeSelect.contains(e.target)
          if (!isRefs) {
            this.searchBox = false
          }
        }
   }
}


beforeDestroy () {
   window.removeEventListener('mouseup', this.mouseupInput);
}