在 useEffect 中提示内存泄漏警告问题

我正在尝试根据条件更新一段 UI。条件由单独组件中的数据库调用设置。它有时有效,但通常无效。当它不起作用时,它会收到此错误:

Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.

我尝试在useEffect中进行代码清理如下:

const [isPatched, setIsPatched] = useState<boolean>(false);

useEffect(() => {
    x.Log ? setPatched(true) : setPatched(false);
    return () => {
      setIsPatched(false);
    };
  }, []);

  const setPatched = (patched: boolean) => {
    setIsPatched(patched);
  };

 其他组件调用数据库的方法如下:

  useEffect(() => {
    if (disabled === true) {
      const handle = setTimeout(() => setDisabled(false), 7000);
      return () => clearTimeout(handle);
    }
  }, [disabled]);

  function handleClick() {
   [...]
    const updatePatchedX = async (id: string) => {
      //check if patched x already in db
      const content = await services.xData.getxContent(id);
      const xyToUpdated = content?.p[0] as T;

      if (!xToUpdated.log) {
        // add log property to indicate it is patched and put in DB
        xToUpdated.log = [
          { cId: cId ?? "", uId: uId, appliedAt: Date.now() },
        ];

        if (content) {
          await services.xData
            .updateOTxBook(id, content, uId)
            .then(() => {
              console.log("done");
              setPatched(true);
              setDisabled(true);
            });
        }
      }
    };

    updatePatchedX(notebookID);
  }

UI仅在刷新时固定,而不是立即固定,正如useEffect应该实现的那样?不知道问题出现在哪里。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值