Невозможно выполнить обновление состояния React на отключенном компоненте для использования

Иногда я получаю сообщение об ошибке, и полное сообщение об ошибке выглядит следующим образом: Предупреждение: не удается выполнить обновление состояния React для несмонтированного компонента. Это не работает, но указывает на утечку памяти в вашем приложении. Чтобы исправить это, отмените все подписки и асинхронные задачи в функции очистки useEffect.

Как лучше всего это исправить? Это мой код:

const CustomRefresh = (props) => {
  const {
    isCurrent, isScheduled
  } = props;
  const [refreshing, setRefreshing] = useState(false);

  const inventoryContext = useContext(inventoryContext);

  const onRefresh = React.useCallback(async () => {
    setRefreshing(true);

    if (isCurrent) {
      await inventoryContext.refreshToday();
    }

    if (isScheduled) {
      await inventoryContext.refreshScheduled();
    }

    setRefreshing(false);
  }, [refreshing]);

  return (
    <CustomRefresh refreshing={refreshing} style={style} onRefresh={onRefresh}>
      {children}
    </CustomRefresh>
  );
};

reactjs use-effect usecallback
person zosozo    schedule 09.03.2021    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Добавьте реф, в котором вы отслеживаете, размонтирован ли он. Затем в вашей функции проверьте этот ref перед установкой асинхронно устанавливающего состояния:

  const unmounted = useRef(false);
  useEffect(() => {
    return () => { unmounted.current = true };
  }, []);

  const onRefresh = React.useCallback(async () => {
    setRefreshing(true);

    if (isCurrent) {
      await inventoryContext.refreshToday();
    }

    if (isScheduled) {
      await inventoryContext.refreshScheduled();
    }

    if (!unmounted.current) {
       setRefreshing(false);
    }
  }, [refreshing]);
person Nicholas Tower    schedule 09.03.2021
comment
Он удалил ошибку, но теперь обновление всегда верно - person zosozo; 09.03.2021
comment
Если компонент размонтирован, какое значение имеет его последнее состояние? - person Nicholas Tower; 09.03.2021
comment
потому что я использую его для рендеринга загрузочного счетчика, но мне удалось исправить его, немного изменив ваш код, спасибо! - person zosozo; 09.03.2021