1

我有以下用反应编写的代码，我得到内存泄漏错误。我尝试了一些技巧，例如调用 abort 并将状态设置为 null，但到目前为止对我没有任何作用。

我得到的错误：

无法对未安装的组件执行 React 状态更新。这是一个空操作，但它表明您的应用程序中存在内存泄漏。要解决此问题，请在使用 Effect 清理功能时取消所有订阅和异步任务。

我的代码片段：

useEffect(() => {
    //some const defined
    fetch(myData)
        .then(response => response.json())
        .then(data => {
            //some code

            if (consition) {
                //setting state
                setData(abc);
                setDataPresent(true);
            }
        });
    // fix for memory leak error
    return () => {
        setData({});
        setDataPresent(false);
    };
}, [dep]);
4

1 回答 1

0

试试这个！您需要使用 useEffect 取消承诺。

在下面的代码中， fetch 函数返回一个 Promise。您可以通过在 useEffect 范围内设置条件来取消承诺，从而防止应用在组件卸载后设置状态。

我建议阅读这篇关于在 useEffect 中取消承诺的简短文章。 https://juliangaramendy.dev/blog/use-promise-subscription

不要忘记 useEffect 中的依赖关系。

// Let's start!
useEffect(() => {
    let isMounted = true;

    fetch(myData)
        .then(response => response.json())
        .then(data => {
            if (isMounted) {
                setDataPresent(true)
                setData(abc)
            }
        });

    return () => {
        isMounted = false;
    };
}, [deps]);
于 2021-10-10T17:08:43.643 回答