React useEffect сводка

Следующий код будет выводить x на консоль каждый раз, когда отрисовывается компонент-оболочка:

useEffect(() => {
  console.log('x');
});

Следующий код будет выводить x на консоль каждый раз, когда компоненты, указанные в массиве зависимостей, изменяются:

useEffect(() => {
   console.log('x');
}, [dep1, dep2, dep3...depN]);

Следующий код будет печатать x каждый раз, когда компоненты, указанные в массиве зависимостей, изменяются, и после первого выполнения он будет запускать возвращаемую функцию перед каждым выполнением:

useEffect(() => {
  console.log('x');

  return () => { 
    console.log('running before the the after-first useEffect execution');
  };
}, [dep1, dep2, dep3...depN]);

Следующая функция будет печатать x каждый раз, когда компонент-оболочка монтируется, и 'y', когда он размонтируется:

useEffect(() => {
  console.log('x');

  return () => { 
    console.log('y');
  };
}, []); // mind the empty dep array