让react useState 像 class组件的setSta

2023-07-21  本文已影响0人  每天洗脸刷幸运值
import { useRef, useCallback, useState, useEffect } from 'react';

function useStateCallback<T>(
  initialState: T
): [T, (state: T, cb?: (state: T) => void) => void] {
  const [state, setState] = useState(initialState);
  const cbRef = useRef<((state: T) => void) | undefined>(undefined);

  const setStateCallback = useCallback(
    (mergedState: T, cb?: (state: T) => void) => {
      cbRef.current = cb;
      setState(mergedState);
    },
    []
  );

  useEffect(() => {
    if (cbRef.current) {
      cbRef.current(state);
      cbRef.current = undefined;
    }
  }, [state]);

  return [state, setStateCallback];
}

export default useStateCallback;

上一篇 下一篇

猜你喜欢

热点阅读