강의

멘토링

로드맵

Inflearn brand logo image

인프런 커뮤니티 질문&답변

sohee님의 프로필 이미지
sohee

작성한 질문수

처음 만난 리액트(React)

componentDidUpdate 관련 질문

해결된 질문

작성

·

573

0

Snipaste_2023-07-07_15-34-15.png3개의 배열 메세지 모두 동일하게 map함수로 돌리고 화면에 출력하였는데, 1 didupdate call만 두 번 콘솔에 찍히고 3번 didupdate call는 콘솔에 안 찍히는 이유가 궁금합니다

답변 1

0

Inje Lee (소플)님의 프로필 이미지
Inje Lee (소플)
지식공유자

안녕하세요, 소플입니다.

 

처음 1번이 마운트(Mount) 된 시점에서 2번이 마운트 될 때,

재렌더링이 일어나면서 기존에 마운트 되어 있던 1번이 업데이트 됩니다.

 

그리고 1, 2번이 마운트 된 시점에서 3번이 마운트 될 때,

재렌더링이 일어나면서 기존에 마운트 되어 있던 1, 2번이 업데이트 됩니다.

 

그리고 1, 2, 3번이 모두 마운트 된 이후에는 따로 재렌더링이 일어나지 않고,

바로 모든 컴포넌트를 언마운트 시키기 때문에 1, 2, 3번의 언마운트(Unmount) 로그가 찍히는 것입니다.

 

이 흐름을 잘 이해한 이후에 다시 한 번 코드와 로그를 살펴보시기 바랍니다!

감사합니다.

sohee님의 프로필 이미지
sohee
질문자

그러면 혹시 배열이 4번까지 있게 되는 경우에는 1번이 마운드 되고 2번이 마운트 될 때 1번이 업데이트 되고 이번이 마운트 되고 3번이 마운트 될 때 1번과 2번이 업데이트 되고 3번이 마운트 된 후에 또 4번이 마운트 될 때 1,2,3번이 업데이트 되고 4번이 마운트 된 후에 1.2.3.4가 언마운트 되게 되는건가요?

Inje Lee (소플)님의 프로필 이미지
Inje Lee (소플)
지식공유자

네, 맞습니다~!

직접 코드에 아이템을 하나 더 넣어서도 확인해보시면 좋을 것 같습니다.

감사합니다.

sohee님의 프로필 이미지
sohee

작성한 질문수

질문하기