UNPKG

996 BJavaScriptView Raw
1import { useEffect, useDebugValue, useRef } from 'react';
2import useDebouncedState from './useDebouncedState';
3const defaultIsEqual = (a, b) => a === b;
4/**
5 * Debounce a value change by a specified number of milliseconds. Useful
6 * when you want need to trigger a change based on a value change, but want
7 * to defer changes until the changes reach some level of infrequency.
8 *
9 * @param value
10 * @param waitOrOptions
11 * @returns
12 */
13function useDebouncedValue(value, waitOrOptions = 500) {
14 const previousValueRef = useRef(value);
15 const isEqual = typeof waitOrOptions === 'object' ? waitOrOptions.isEqual || defaultIsEqual : defaultIsEqual;
16 const [debouncedValue, setDebouncedValue] = useDebouncedState(value, waitOrOptions);
17 useDebugValue(debouncedValue);
18 useEffect(() => {
19 if (!isEqual || !isEqual(previousValueRef.current, value)) {
20 previousValueRef.current = value;
21 setDebouncedValue(value);
22 }
23 });
24 return debouncedValue;
25}
26export default useDebouncedValue;
\No newline at end of file