在componentWillUnmoint中删除匿名侦听器

Question

我想在我的react组件中删除一个点击监听器。这是有效的代码吗？ （顺便说一句：我根本没有在这个项目中使用“绑定”。）

componentDidMount() {
window.addEventListener('click', () => console log('all selected elements should be removed now!'));
}


componentWillUnmount() {
window.removeEventListener('click', () => console log('all selected elements 
should be removed now!'));
}

Answer 1

addEventListner和removeEventListeners都需要为处理程序使用相同的引用，因此匿名函数将不起作用。

根据eventListener文档：

  

要删除的事件侦听器使用以下命令组合标识   事件类型，事件侦听器函数本身以及各种   可能会影响匹配过程的可选选项

添加和删除侦听器时，您需要使用相同的功能引用

handleClick = () =>{
   console log('all selected elements should be removed now!');
}
componentDidMount() { window.addEventListener('click', this.handleClick) }

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