异步处理正在使用Effect

Question

我正在使用一个自定义挂钩来创建3秒后自动注销的行为。我从我的主要组件调用这个钩子，并使用isLogin决定登录状态。设置凭据后，将调用setLogin函数，并由于useEffect将setTimeout加载到内存中。问题是，3秒钟后我收到这个错误，

无法对未安装的组件执行React状态更新。这是一个非操作，但它表明应用程序中存在内存泄漏

如果你认为这不是处理这种情况的正确方法，请指导我。

const [isLogin, setLogin] = useState(someValue);
useEffect(() => {
if (tokenExist && notExpireYet) {
setTimeout(() => remValue(), 3000);
}
}, [isLogin]);

Answer 1

问题是即使在卸载组件后也会调用setTimeout调用。为了正确地清理依赖项更改之间的影响，您应该返回一个清理的函数。

在你的情况下，它会是这样的：

const [isLogin, setLogin] = useState(someValue);
useEffect(() => {
if (tokenExist && notExpireYet) {
const id = setTimeout(() => remValue(), 3000);
return () => clearTimeout(id);
}

}, [isLogin]);

这将确保当组件不在时，效果不会运行。