REACT

usePrevious Hook

A custom React Hook to get the previous value of a state/prop with TypeScript support

ReactHooksStateUtilities

Code

import { useRef, useEffect } from 'react';

function usePrevious<T>(value: T): T | undefined {
  const ref = useRef<T>();

  useEffect(() => {
    ref.current = value;
  }, [value]);

  return ref.current;
}

// Usage example
// const [count, setCount] = useState(0);
// const prevCount = usePrevious(count);
// console.log('Current:', count, 'Previous:', prevCount);

// Advanced usage - compare changes
// const [user, setUser] = useState({ name: 'John', age: 30 });
// const prevUser = usePrevious(user);
// useEffect(() => {
//   if (prevUser?.age !== user.age) {
//     console.log('Age changed!');
//   }
// }, [user, prevUser]);