Реагуйте на використання Вплив на глибину / використання useEffect?

Я намагаюся глибше зрозуміти useEffectгачок.

Мені хотілося б знати, коли використовувати який метод і чому?

1.useEffect with no second paraments
 useEffect(()=>{})

2.useEffect with second paraments as []
  useEffect(()=>{},[])

3.useEffect with some arguments passed in the second parameter
 useEffect(()=>{},[arg])

useEffect(callback)

Працює на кожному компоненті візуалізації.

Зазвичай використовується для налагодження, аналогічне виконанню функції функції кожного рендеру:

const Component = () => {
  callback()
  return <></>;
};

useEffect(callback,[])

Запускається один раз на компонентному кріпленні.

Зазвичай використовується для ініціалізації стану компонентів шляхом отримання даних тощо.

Примітка : Як передзвонити виконується після того, як на етапі рендеринга (Known «Попався»).

useEffect(callback,[arg])

Запускається на зміну в argвартості.

"У зміні" позначає неглибоке порівняння з попереднім значенням arg(порівнює значення argпопереднього візуалізації та поточного, prevArg === arg ? Do nothing : callback()).

Зазвичай використовується для запуску подій на реквізиті / зміні стану.

Примітка. Можна надати декілька залежностей: [arg1,arg2,arg3...]

• Повне керівництво useEffectДаном Абрамовим
• useEffectAPI .
• Використання гачка ефектів - реагуйте на документи.

Якщо ви знайомі з методами життєвого циклу React, ви можете подумати про використанняEffect Hook як компонентDidMount, компонентDidUpdate та компонентWillUnmount.

1.useEffect без другого параменту: Це використовується, коли ми хочемо, щоб щось сталося або коли компонент щойно встановлений, або якщо він був оновлений. Концептуально ми хочемо, щоб це сталося після кожного візуалізації.

2.useEffect з другими параментами як []: Це використовується, коли ми хочемо, щоб щось сталося під час монтажу компонента, якщо воно виконується лише один раз під час монтажу. Це ближче до знайомих компонентаDidMount та компонентаWillUnmount.

3.useEffect з деякими аргументами, переданими у другому параметрі: Це використовується, коли ми хочемо, щоб щось сталося в той момент, коли прамтер передав напр. аргументи змінилися у вашому випадку.

Для отримання додаткової інформації. перевірте тут: https://reactjs.org/docs/hooks-effect.html

3.useEffect з деякими аргументами, переданими у другому параметрі useEffect (() => {}, [arg])

він запуститься спочатку, потім він запуститься знову, якщо аргумент зміниться

Забудьте також запитати, що про повернення всередині useEffect ... Його використання для очищення воно буде працювати, коли компонент демонтувати