How to use `setState` callback on react hooks

You need to use useEffect hook to achieve this.

const [counter, setCounter] = useState(0);const doSomething = () => {  setCounter(123);}useEffect(() => {   console.log('Do something after counter has changed', counter);}, [counter]);

If you want to update previous state then you can do like this in hooks:

const [count, setCount] = useState(0);setCount(previousCount => previousCount + 1);

Mimic setState callback with useEffect, only firing on state updates (not initial state):

const [state, setState] = useState({ name: "Michael" })const isFirstRender = useRef(true)useEffect(() => {  if (isFirstRender.current) {    isFirstRender.current = false // toggle flag after first render/mounting    return;  }  console.log(state) // do something after state has updated}, [state])

Custom Hook useEffectUpdate

function useEffectUpdate(callback) {  const isFirstRender = useRef(true);  useEffect(() => {    if (isFirstRender.current) {      isFirstRender.current = false; // toggle flag after first render/mounting      return;    }    callback(); // performing action after state has updated  }, [callback]);}// client usage, given some state depconst cb = useCallback(() => { console.log(state) }, [state]); // memoize callbackuseEffectUpdate(cb);