Javascript 为什么这些功能的工作方式不同？

仅当组件尚未卸载时，我才尝试在进行API调用后设置属性的状态。在第一个函数中，变量“unmounted”在函数“Component”内初始化；在本例中，我收到以下警告：“无法对未安装的组件执行React状态更新。这是一个no op，但它表明应用程序中存在内存泄漏。”

在第二个函数中，我全局初始化变量“unmounted”，在本例中，我没有收到任何警告

显示一个警告： 无警告：

---

任何人都可以解释为什么会发生这种情况？

在您的第一个示例中，每次渲染后，

卸载

将始终为

假

以下是不使用全局实例的正确方法：

函数组件（）{
const[emailSent，setEmailSent]=useState（false）；
const unmounted=useRef（false）；
异步函数handleSendmail（formValues）{
试一试{
等待AuthApi.sendRecoverAccountEmail（'123'）；
！unmounted.current&&setEmailSent（true）；
}捕捉（错误）{
！unmounted.current&&setIsSendingEmail（false）；
}
}
useffect（（）=>{
return（）=>{
unmounted.current=true；
};
}, []);
}

一个有趣的问题。你可能会发现这本书很有用，因为我认为它相当具体地解决了你的问题

在第一个示例中，未装载的var是组件属性的一部分，而在第二个示例中，它只是作为javascript闭包的一部分获取的

通常，您希望确保将装入的参数更改为

我认为如果您将unmounted添加到依赖项列表中，它可能会工作吗？我通常在Clojurescript中使用来自另一个框架的react，因此我不完全熟悉主javascript接口的语义，但这至少是第一个示例得到警告的原因

在第一个示例中，如果将最后一部分更改为以下内容，会发生什么情况

useEffect(() => {
  return () => {
   unmounted = true;
  };
 }, [unmounted]);
}

---

您可能需要将unmounted定义为更正式的react属性，而不仅仅是包含在组件中的属性

也许可以添加

未安装的

作为状态变量<代码>常量[unmounted，setUnmounted]=useState（false）并从那里开始谢谢您的解决方案。很好用。但在卸载组件后不会重新渲染（我将使用单独的路径）。“unmounted”变量没有被覆盖。您的答案有几个缺陷：1。没有组件DidUnmount，我想你的意思是组件WillUnmount。2.在useEffect的可选参数数组中，您应该只传递道具或状态。

var unmounted = false;
function Component() {
const [emailSent, setEmailSent] = useState(false);

async function handleSendEmail(formValues) {
 try {
  await AuthApi.sendRecoverAccountEmail('123');
  !unmounted && setEmailSent(true);
 } catch (err) {
  !unmounted && setIsSendingEmail(false);
 }
}

useEffect(() => {
  return () => {
   unmounted = true;
  };
 }, []);
}

useEffect(() => {
  return () => {
   unmounted = true;
  };
 }, [unmounted]);
}