|
- import { useEffect, useRef, useState } from 'react';
-
- type Callback<T> = (state: T) => void;
-
- /**
- * 生成一个具有回调机制的可变状态值和更新它的函数。谨慎使用
- *
- * @param initialValue - 初始状态值。
- * @return 一个元组,包含当前状态值和用于更新状态的函数。
- */
- export function useCallbackState<T>(initialValue: T) {
- const [state, _setState] = useState<T>(initialValue);
- const callbackQueue = useRef<Callback<T>[]>([]);
- useEffect(() => {
- callbackQueue.current.forEach((cb) => cb(state));
- callbackQueue.current = [];
- }, [state]);
- const setState = (newValue: T | ((prevState: T) => T), callback?: Callback<T>) => {
- _setState(newValue);
- if (callback && typeof callback === 'function') {
- callbackQueue.current.push(callback);
- }
- };
- return [state, setState] as const;
- }
|