如何在清理函数中的 React js 中执行 fileReader.removeEventListener

Posted 2023-03-17

【中文标题】如何在清理函数中的 React js 中执行 fileReader.removeEventListener

【英文标题】：How to do fileReader.removeEventListener in React js in cleaup function

【发布时间】：2021-07-25 01:08:51

【问题描述】：

我在 React js 中实现了一个图像预览器 这是codesandbox .我想在组件卸载时删除EventListener，但我无法做到。 我尝试使用 useRef 执行此操作，但出现未定义错误和此警告

The ref value 'fileReader.current' will likely have changed by the time this effect cleanup function runs. If this ref points to a node rendered by React, copy 'fileReader.current' to a variable inside the effect, and use that variable in the cleanup function.

【参考方案1】：

你可以在 useEffect 中返回一个清理函数——这是处理它的推荐方法。请参考：How do I window removeEventListener using React useEffect

【讨论】：

这不起作用，因为我已经尝试过了。它不起作用，因为我们添加事件监听器的对象不一样。此外，如果您确定您提供的答案，您可以编辑代码框并分享链接。