Koje metode životnog ciklusa postoje u Reactu i kako ih emulirati pomoću useEffect?

У React класи компоненти постоји неколико метода циклуса живота, од којих су главне:

• componentDidMount — позива се након монтирања компоненти;
• componentDidUpdate — позива се након ажурирања компоненти;
• componentWillUnmount — позива се пре демонтирања компоненти.

У функционалним компонентама са hook-ом useEffect, ове методе могу се емуловати на следећи начин:

import React, { useEffect } from 'react';

function MyComponent(props) {
  // componentDidMount
  useEffect(() => {
    // код који се извршава једном након монтирања
    console.log('Mounted');
  }, []); // празан низ зависности

  // componentDidUpdate
  useEffect(() => {
    // код који се извршава при промени props или стања
    console.log('Updated');
  }); // без другог аргумента — позива се након сваког рендеровања

  // componentWillUnmount
  useEffect(() => {
    return () => {
      // код за чишћење пре демонтирања
      console.log('Unmounted');
    };
  }, []);

  return <div>{props.value}</div>;
}

На овај начин, useEffect са празним низом зависности емулатује componentDidMount и componentWillUnmount (преко функције за чишћење), а useEffect без другог аргумента — componentDidUpdate.