解决方法：无法对卸载的组件执行 React 状态更新 下一页.js ||onScroll 事件

Question

这里是代码

const [scroll, setScroll] = useState(false);
useEffect(() => {
window.addEventListener("scroll", () => {
setScroll(window.scrollY > specify_height_you_want_to_change_after_here);
});
}, []);

得到这个错误

警告：无法对未安装的组件执行React状态更新。这是一个非操作，但它表明应用程序中存在内存泄漏。若要修复此问题，请取消useEffect清理函数中的所有订阅和异步任务

Answer 1

您需要删除useEffect清理函数中的事件侦听器。此函数在组件卸载时运行。

useEffect(() => {
window.addEventListener("scroll", () => {
setScroll(window.scrollY > specify_height_you_want_to_change_after_here);
});
return () => window.removeEventListener("scroll", () => {
setScroll(window.scrollY > specify_height_you_want_to_change_after_here);
});
}, []);

为了提高代码的可读性，您可能需要将侦听器分离为一个单独的函数。

useEffect(() => {
const scrollListener = () => {
setScroll(window.scrollY > specify_height_you_want_to_change_after_here);
}
window.addEventListener("scroll", scrollListener);
return () => window.removeEventListener('scroll', scrollListener);
}, []);