Когда срабатывает useEffect в componentWillUnmount?
Я прочитал ниже заявление в блоге, там написано что-то вроде этого
useEffect(() => {
API.getUser(userId);
}, [userId]);
Optionally the second parameter can also just be an empty array, in this case it will only execute on
componentDidMountandcomponentWillUnmountand the effect won't run oncomponentDidUpdate.
Выполняется ли API.getUser при размонтировании компонента (componentWillUnmount)? насколько я знаю, componentWillUnmount срабатывает, когда вы переходите со страницы A на страницу B. Теперь я запутался, для меня приведенный выше код действует как componentDidMount, потому что userId изменится с undefined на id один раз.
Ответы 2
Вы можете вернуть функцию очистки из useEffect, которая будет запущена до размонтирования.
useEffect(() => {
const subscription = props.source.subscribe(); // this will fire at after did Mount/ didUpdate
return () => {
// Clean up the subscription
subscription.unsubscribe(); // this will afire at willUnmount
};
});
Если вы передаете пустой массив в качестве второго параметра.
useEffect(() => {
const subscription = props.source.subscribe(); // this run only after first rnede i.e componentDidmount
return () => {
// Clean up the subscription
subscription.unsubscribe(); // this will afire at willUnmount ie componentWillUnmount
};
}, []);
нет. Это верно. если вы передадите пустой массив в качестве второго параметра, useEffect будет запускаться только после первого рендеринга, он не будет запускаться после каждого обновления. и возвращенная функция будет работать до размонтирования.
ваш первый блок кода имеет комментарий //// это загорится на willUnmount, что вы имеете в виду?
пустой массив делает useEffect точно так же, как сказал @eramit2010. для кода Hanz каждый раз при изменении useId будет выполняться код внутри useEffect
второй параметр в useEffect — зависимости. поэтому, если вы передаете его как пустой массив, он сообщает useEffect о запуске только после первого рендеринга (componentDidUpdate), а возвращаемая функция является функцией очистки, поэтому она будет выполняться до размонтирования (componentWillUnmount)
чтобы избежать путаницы: для первого примера кода subscription.unsubscribe() будет запускаться в cWU, но также он будет запускаться перед каждым повторным рендерингом.
нет. useEffect никогда не запускается перед рендерингом. он всегда запускается после рендера. и функция очистки запускается только перед размонтированием (componetWillUnmount).
Вы немного запутались с формулировкой. Это не эффект, который выполняется при размонтировании, когда вы передаете пустой массив, а функция очистки, которая является функцией, возвращаемой из useEffect, которая будет выполнена.
например, вы можете получить вышеуказанный эффект, например
useEffect(() => {
API.getUser(userId);
return () => {
// cancel api here
}
}, [userId]);
Таким образом, в приведенном выше примере анонимная функция, возвращаемая useEffect, будет вызываться до того, как эффект будет запущен во второй раз (что происходит при изменении userId) или во время размонтирования.
формулировка сбивает с толку, потому что у нее нет второй функции возврата
Это длинное чтение, но, как говорится, полное руководство по
useEffectот создателя: overreacted.io/a-complete-guide-to-useeffect