useCallback<T extends Function> function

T useCallback<T extends Function>(
  1. T callback,
  2. List dependencies
)

Returns a memoized version of callback that only changes if one of the dependencies has changed.

Note: there are two rules for using Hooks:

  • Only call Hooks at the top level.
  • Only call Hooks from inside the first argument of uiFunction.

Example:

UiFactory<UseCallbackExampleProps> UseCallbackExample = uiFunction(
  (props) {
    final count = useState(0);
    final delta = useState(1);

    var increment = useCallback((_) {
      count.setWithUpdater((prev) => prev + delta.value);
    }, [delta.value]);

    var incrementDelta = useCallback((_) {
      delta.setWithUpdater((prev) => prev + 1);
    }, []);

    return Fragment()(
      Dom.div()('Delta is ${delta.value}'),
      Dom.div()('Count is ${count.value}'),
      (Dom.button()..onClick = increment)('Increment count'),
      (Dom.button()..onClick = incrementDelta)('Increment delta'),
    );
  },
  _$UseCallbackExampleConfig, // ignore: undefined_identifier
);

Learn more: reactjs.org/docs/hooks-reference.html#usecallback.

Implementation

T useCallback<T extends Function>(T callback, List dependencies) => react_hooks.useCallback(callback, dependencies);