Question

我正在尝试从会话中获取结果并在我的 React 组件中设置其状态。但是每次遇到内存泄漏问题时，我都无法将会话状态设置为 true。

我的 useEffect 代码如下所示：

useEffect(() => {
 let mounted = true;
  getSession()
    .then(session => {
      console.log('session: ', session);
      if (mounted) {
      setStatus(true);
     }
    })
    .catch(e => {
      console.log('inside error or no session found');
      console.log(e);
    });

 return () => {
   mounted = false;
 };
}, [status, getSession]);

我尝试了以下方法来解决我的问题：Boolean Flag to Control the useEffect 和 AbortController to clean the useEffect，但它们都不起作用。

你能提出什么问题吗？

Answer 1

您的 mounted 变量的名称表明您希望效果回调仅在第一次挂载时触发，而清理仅在卸载时触发，但您的依赖数组可确保清理和效果回调发生 < strong>每次 status 或 getSession 变化。

您没有在回调中使用 status，因此您应该删除它以避免在设置 true 时触发效果。如果 getSession 在组件的整个生命周期内是稳定的（不改变），您也可以将其删除。然后，对于一个空的依赖数组，您的回调只会在装载时被调用，而您的清理只会在卸载时被调用。

只是一个旁注：如果您可以修改 getSession 以接受 AbortSignal，您可以使用它来告诉它主动取消其操作，通常这是更可取的。例如，如果您使用 fetch（也许 getSession 是在幕后使用？），您可以这样做，因为 fetch 接受 AbortSignal。详细信息：fetch、AbortController、AbortSignal

无法在 useEffect

1 个答案: