关于状态快照和从 react 文档重新渲染的问题

问：

React 文档中的一个问题：

下面的例子是我的理解：

• 更改时<输入>元素触发重新渲染
• 重新渲染后应更新状态“text”
• 在调用 handleSend（） 时（设置了超时），“text” 保存初始值
• 执行回调 3 秒后，如果我们更改了输入框中的值，则应更新“text”，因为组件已经重新渲染。

在回调之前，重新渲染必须发生得更快，无法弄清楚为什么它仍然打印初始值，并且必须改用 useRef（）。

import { useState, useRef } from 'react';

export default function Chat() {
  const [text, setText] = useState('');

  function handleSend() {
    setTimeout(() => {
      alert('Sending: ' + text);
    }, 3000);
  }

  return (
    <>
      <input
        value={text}
        onChange={e => setText(e.target.value)}
      />
      <button
        onClick={handleSend}>
        Send
      </button>
    </>
  );
}

https://react.dev/learn/referencing-values-with-refs 挑战 #4