component's lifecycle

In React functional components, lifecycle-like behaviors are achieved ==using hooks==:

Mounting and Unmounting

Utilizing the useEffect hook with an empty dependency array ([]) ensures the hook runs after ==the component mounts to the DOM==.

useEffect(() => {
  // do something after component mounts
  return () => {
    // do something before component unmounts
  };
}, []);

The cleanup function returned within the useEffect callback offers a mechanism for handling tasks when the component is about to unmount.

Updates

The useEffect hook, when invoked without a dependency array or with specific dependencies, executes after ==every render== or when ==specified prop/state changes are detected==.

useEffect(() => {
  // do something after every render
});

useEffect(() => {
  // do something after specific prop/state changes
}, [state1, state2]);