Встречается на 1% собеседований по Python

Как реализовать жизненные циклы компонентов с помощью useEffect

В React с хуками useEffect позволяет управлять жизненным циклом компонента. Основные сценарии:

  1. Монтирование (аналог componentDidMount):
jsx
useEffect(() => {
  // Код выполнится при монтировании
  console.log('Компонент смонтирован');
  
  return () => {
    // Код выполнится при размонтировании
    console.log('Компонент будет размонтирован');
  };
}, []); // Пустой массив зависимостей
  1. Обновление (аналог componentDidUpdate):
jsx
useEffect(() => {
  // Код выполнится при каждом обновлении
  console.log('Компонент обновился');
});
  1. Зависимость от пропсов/стейта:
jsx
useEffect(() => {
  // Код выполнится при изменении переменной count
  console.log(`Count изменился: ${count}`);
}, [count]); // Указание зависимостей
  1. Очистка (аналог componentWillUnmount):
jsx
useEffect(() => {
  const timer = setInterval(() => {}, 1000);
  
  return () => {
    clearInterval(timer); // Очистка при размонтировании
  };
}, []);

Важно помнить, что useEffect выполняется после рендера компонента. Для синхронных операций до рендера используйте useLayoutEffect.

Sophi
Софи собрала все вопросы. Тренируйся и получай
офферы быстрее!
Попробовать бесплатноArrow

Следующий вопрос

Это единственный вопрос по вашему фильтру

Похожие вопросы

как отвечать на вопрос
пример собеседования
фреймворки на собеседовании
типичные вопросы junior
интервью вопросы и ответы