关于在react中addEventListener事件绑定以及点击位置判断

[ckinmind]

问题描述：在react环境中，需要判断全局冒泡的点击，如果来自某一区域则不管，除此之外的点击需要做一些副操作，比如讲某个下拉框收起等等

[ckinmind]

问题解决：这个问题拆分成两个问题，一个是react中的事件绑定以及解除绑定，另一个是判断点击区域

class A extends Component {

    constructor(props) {
        super(props)
        this.handleClick.bind(this)
    }

    componentDidMount() {
        window.addEventListener('click', this.handleClick)
    }
    
    componentWillUnmount(){
        window.removeEventListener('click', this.handleClick)
    }

   handleClick(e) {
     const dom = e.target.closest('.organization-action')
    if (dom) {
       // 如果是来自某个区域的点击
    } else {
      // 如果不是来自某个区域的点击
    }
  }

  render() {}

}

MDN: Element.closest()
Element.closest() 方法用来获取：匹配特定选择器且离当前元素最近的祖先元素（也可以是当前元素本身）。如果匹配不到，则返回 null