React usePrevious Hook

Hooks are important for the practical part sample in React. One frequent logic comparability with class elements was evaluating a earlier prop worth with a present prop worth through lifecycle strategies. So what’s a straightforward sample for duplicating earlier worth comparisons in practical elements?

The useRef and useEffect hooks enable us handle that very same performance in practical elements through a customized hook — usePrevious:

import { useEffect, useRef } from 'react';

export perform usePrevious(worth) {
  const ref = useRef();
  useEffect(() => {
    ref.present = worth;
  }, [value]);
  return ref.present;
}

// Utilization
export perform MyComponent(props) {
  const { title } = props;
  const previousName = usePrevious(title);

  if(title != previousName) {
    // Do one thing
  }
}

I really like this usePrevious hook, if solely as a result of I continuously neglect to make use of the .present property and it helps keep away from some boilerplate code. What are your ideas on this sample? Do you will have any customized hooks you depend on?