mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-05 09:49:57 +08:00
a26517f9ab
* init hooks * Use raf to sync list * clean up
57 lines
1.2 KiB
TypeScript
57 lines
1.2 KiB
TypeScript
import { useRef, useEffect } from 'react';
|
|
import raf from 'rc-util/lib/raf';
|
|
import useForceUpdate from '../_util/hooks/useForceUpdate';
|
|
|
|
// Note. Only for upload usage. Do not export to global util hooks
|
|
export default function useFreshState<T>(
|
|
defaultValue: T,
|
|
propValue?: T,
|
|
): [(displayValue?: boolean) => T, (newValue: T) => void] {
|
|
const valueRef = useRef(defaultValue);
|
|
const forceUpdate = useForceUpdate();
|
|
const rafRef = useRef<number>();
|
|
|
|
// Set value
|
|
function setValue(newValue: T) {
|
|
valueRef.current = newValue;
|
|
forceUpdate();
|
|
}
|
|
|
|
function cleanUp() {
|
|
raf.cancel(rafRef.current!);
|
|
}
|
|
|
|
function rafSyncValue(newValue: T) {
|
|
cleanUp();
|
|
rafRef.current = raf(() => {
|
|
setValue(newValue);
|
|
});
|
|
}
|
|
|
|
// Get value
|
|
function getValue(displayValue = false) {
|
|
if (displayValue) {
|
|
return propValue || valueRef.current;
|
|
}
|
|
|
|
return valueRef.current;
|
|
}
|
|
|
|
// Effect will always update in a next frame to avoid sync state overwrite current processing state
|
|
useEffect(() => {
|
|
if (propValue) {
|
|
rafSyncValue(propValue);
|
|
}
|
|
}, [propValue]);
|
|
|
|
// Clean up
|
|
useEffect(
|
|
() => () => {
|
|
cleanUp();
|
|
},
|
|
[],
|
|
);
|
|
|
|
return [getValue, setValue];
|
|
}
|