Sobes.tech
Middle

Magyarázd el egy React-komponens életciklusát. Hogyan kezeljük az eltávolítást a useEffect segítségével?

sobes.tech MI

Válasz az MI-től

Жизненный цикл React-компонента в функциональном стиле с хуками состоит из этапов: монтирование, обновление и размонтирование.

Хук useEffect позволяет выполнять побочные эффекты после рендера. Чтобы обработать размонтирование компонента, нужно вернуть из useEffect функцию очистки (cleanup function). Эта функция вызовется перед размонтированием компонента или перед следующим вызовом эффекта.

Пример:

import React, { useEffect } from 'react';

function MyComponent() {
  useEffect(() => {
    // Код, выполняющийся при монтировании и обновлении
    console.log('Компонент смонтирован или обновлен');

    return () => {
      // Код очистки при размонтировании
      console.log('Компонент размонтируется');
    };
  }, []); // Пустой массив зависимостей — эффект сработает один раз при монтировании

  return <div>Пример компонента</div>;
}

Таким образом, функция, возвращаемая из useEffect, служит для обработки размонтирования компонента.