React 钩子 useState 钩子

Question

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

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

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])