useLatestCallback

useLatestCallback is a version of React's useCallback hook that always has the latest render scope. This is useful for cases where a third-party library requires callback or anywhere it's possible that an old reference to a callback function requires state or scope that has changed since the render that defined the callback.

Import

import { useLatestCallback } from '@hover/blueprint';

API Reference

The API is identical to the API of useCallback, however the dependency list doesn't control the stability of the returned callback reference and instead controls when the callback scope is updated. The callback will be referentially stable across renders regardless of declared dependencies.

import { useState } from 'react';
import { useLatestCallback } from '@hover/blueprint';
const MyComponent = () => {
  const [someState, setSomeState] = useState(false);
  
  const callback = useLatestCallback(() => {
    if (someState) {
      // do something
    }
  }, [someState]);
};

Blueprint

Settings

useLatestCallback

Import

API Reference