Реагирует useState не fre sh в использованииEffect

Question

Мое состояние useState не обновлено в функции useEffect. Это утешает журнал моего старого состояния после того, как я изменил его с помощью setState внутри useEffect. Я знаю, что могу использовать useRef и передать его useState, но он не работает внутри, например, setTimeout. Пример здесь (посмотрите на ловушку. js file и console.logs): https://codesandbox.io/s/prod-wildflower-qbwxt

import React, { useEffect, useState } from "react";
import "./styles.css";
import useLoading from "./hook";

function App() {
//  proptype isLoading simulation
const [isLoading, setIsLoading] = useState(false);
useEffect(() => {
 setTimeout(() => setIsLoading(true), 3000);
}, []);

// hook
const delayedLoading = useLoading(isLoading);

return (
 <div className="App">
   <h1>Hello {`${delayedLoading}`}</h1>
   <h2>Start editing to see some magic happen!</h2>
 </div>
);
}

export default App;

import React, { useEffect, useState } from "react";
import "./styles.css";
import useLoading from "./hook";

function App() {
  //  proptype isLoading simulation
  const [isLoading, setIsLoading] = useState(false);
  useEffect(() => {
    setTimeout(() => setIsLoading(true), 3000);
  }, []);

  // hook
  const delayedLoading = useLoading(isLoading);

  return (
    <div className="App">
      <h1>Hello {`${delayedLoading}`}</h1>
      <h2>Start editing to see some magic happen!</h2>
    </div>
  );
}

export default App;

Answer 1

Обновления состояния имеют асин c характер. Это означает, что если вы установите новое значение для своего состояния, используя метод setter, это не гарантирует, что вы сможете получить новое значение, используя состояние в следующих строках.

React объединяет все установщик метод выполняет и выполняет его сразу.

Чтобы решить вашу проблему, вы можете сохранить значение в переменной, обновить значение в методе сеттера, но продолжить со значением в переменной до конца вашего выполнения