reactjs - React 钩子(Hook) useState 钩子(Hook)

Question

这个问题已经有答案了:

The useState set method is not reflecting a change immediately (19 个回答)

已关闭 去年。

问题是，在网页中该值会递增并显示，但在控制台中它显示以前的值......我不明白什么？

当我单击按钮时，在网页中该值会增加，但在控制台输出中它仍然是以前的值:/

function App() {
  function handleClick()
  {
 
    setValue((prev)=>prev+1)
    console.log(value)

  }
  const [value,setValue]=useState(0);
  return (

    <div className="App" style={{fontSize:"100px"}}>
      {value}
      <button onClick={handleClick}>increment</button>
    </div>
  );
}

export default App;

Answer 1

这是因为 setValuse 是异步函数，状态中的值将在下一个渲染器中更新。

检查一下:

  function handleClick()
  {
 
    setValue((prev)=>prev+1)
    console.log(value)

  }
  const [value,setValue]=useState(0);
  
  useEffect(() => { console.log(value)}, [value])