useEffect의 cleanup이 호출되는 두 가지 상황

정리 함수(cleanup function)는 useEffect 함수 내에서 반환되는 함수입니다. 컴포넌트가 언마운트될 때 정리 함수가 실행된다는 건 대부분 알고 계실겁니다.


그러나, 사실 정리 함수는 두 가지 상황에서 발생한다는 걸 알고 계셨나요? 저자에 의하면, 수백개의 워크샵을 진행했지만 정리 함수가 언제 실행되는 지 정확하게 대답한 사람은 단 한 명 밖에 없었다고 합니다.


정리 함수는 종속성 배열이 변경되어 효과를 다시 실행해야 할 때에도 호출됩니다. 즉, 의존성 배열이 변경되어 useEffect() 함수를 다시 실행하려고 할 때 호출됩니다. React는 새 이펙트를 실행하기 직전에 이전 이펙트의 정리 함수를 실행합니다.


이는 React 공식 문서의 useEffect 섹션에도 언급되어있습니다. (링크: https://react.dev/reference/react/useEffect#my-cleanup-logic-runs-even-though-my-component-didnt-unmount)


> The cleanup function runs not only during unmount, but before every re-render with changed dependencies.


자세한 내용은 아래 글을 읽어주세요.


https://reacttraining.com/blog/useEffect-cleanup

The useEffect cleanup and the two circumstances it's called.

ReactTraining.com

The useEffect cleanup and the two circumstances it's called.

다음 내용이 궁금하다면?

또는

이미 회원이신가요?

2024년 3월 17일 오전 6:40

 • 

저장 16조회 2,359

댓글 0