UNPKG

1.25 kBTypeScriptView Raw
1import { EffectCallback, DependencyList, Comparator } from '../types';
2/**
3 * A replacement for React.useCallback that'll allow for custom and deep compares.
4 * @see {@link https://reactjs.org/docs/hooks-reference.html#usecallback}
5 * @param callback Accepts a callback that's forwarded to React.useCallback
6 * @param dependencies A dependency array similar to React.useCallback however it utilizes a deep compare
7 * @param customCompare Opportunity to provide a custom compare function
8 * @returns A memoized callback
9 * @example
10 * const Child = memo(function Child({onClick}) {
11 * console.log('Child has rendered.');
12 * return <button onClick={onClick}>Click me</button>;
13 * });
14 *
15 * function ComponentExample() {
16 * const [timesClicked, setTimesClicked] = useState(0);
17 *
18 * const handleClick = useDeepCallback(() => {
19 * setTimesClicked((timesClicked) => timesClicked + 1);
20 * // New reference every render
21 * }, [{}]);
22 *
23 * return (
24 * <Fragment>
25 * <div>Times clicked: {timesClicked}</div>
26 * <Child onClick={handleClick} />
27 * </Fragment>
28 * );
29 * }
30 */
31export declare function useDeepCallback(callback: EffectCallback, dependencies: DependencyList, customCompare?: Comparator): EffectCallback;