window.onpopstate - 我是否需要删除此事件处理程序?

我正在使用window.onpopstate事件处理程序来侦听后退和前进浏览器按钮事件。我的代码看起来是这样的:window.onpopstate - 我是否需要删除此事件处理程序?

componentDidMount() { 

window.onpopstate = this.onBackOrForwardButtonEvent;

}

onBackOrForwardButtonEvent = (e) => {

e.preventDefault();

log.info('back or forward button pressed');

if (this.props.route.path !== '/app') {

// ... do something

}

};

我的问题是:我是否需要删除此事件监听器 - 在componentWillUnmount吧?

类似:

componentWillUnmount() { 

window.removeEventListener('onpopstate', this.onBackOrForwardButtonEvent, false)

}

我使用onPopState看到的例子像我有以上,但从未与除听众组件卸装的时候。

例如:https://github.com/ReactTraining/react-router/issues/967

回答:

我觉得你确定不是担心去除附着事件。

你的例子很有趣,因为事件被附加到窗口而不是dom元素。在这种情况下,我认为你没有删除任何事件,因为事件本身存在 - 每次组件安装时,它都会为已连接的事件重新分配一个处理程序。

分配的处理程序,以无操作可能是在组件卸载如果你想确保组件取出后,在事件犯规发生火灾时更合理。

componentDidUnmount() { 

window.onpopstate =() => {}

}

对于dom事件监听器,这是不同的。

反应应用程序像单页应用程序那样常见,其中新元素通过路由器和客户端导航进行分阶段(挂载),随后在用户浏览页面时卸载。

当一个元件被从DOM(或卸载)中除去,它是以去除附着到其任何事件侦听器的最佳做法。

如果您不删除事件侦听器,则事件可能会不必要地耗尽内存。

它也完全有可能是现代浏览器通过垃圾收集处理这个给你,但是为什么还要自己知道哪些浏览器时,你可以采取什么额外的步骤要小心。

以上是 window.onpopstate - 我是否需要删除此事件处理程序? 的全部内容, 来源链接: utcz.com/qa/266733.html

回到顶部