useLatest

跟蹤 React State 的最新值。

Usage

即時編輯器

function Demo() {
  const [count, setCount] = useState(0);
  const latestCount = useLatest(count);
  const handleAlertClick = () => {
    setTimeout(() => {
      alert(`最新的計數值: ${latestCount.current}`);
    }, 3000);
  };

  return (
    <div>
      <p>您點擊了 {count} 次</p>
      <button onClick={() => setCount(count + 1)}>點擊我</button>
      <button onClick={handleAlertClick}>顯示警告</button>
    </div>
  );
};

結果

您點擊了 0 次

API

useLatest

Returns

React.MutableRefObject<T>: ref 對象

Arguments

參數名	描述	類型	預設值
value	追踪值	T (必填)	-