리액트재렌더링
-
[221130] 리액트 라이프 사이클과 useEffectTIL 2022. 11. 28. 10:03
부모 컴포넌트 A와 자식 컴포넌트 B가 있습니다. 컴포넌트 A는 state로 {name: "르탄이"}를 가지고 있고, 자식인 컴포넌트 B에게 name 값을 넘겨주었습니다. 컴포넌트 B는 받아온 name을 화면에 뿌려주고 있습니다. 컴포넌트 A의 state가 {name: "진도사우르스"}로 바뀌었을 때, 어떤 과정을 거쳐 바뀐 값을 화면에 보여주는 지 라이프 사이클 흐름을 그려볼까요? 컴포넌트가 real DOM으로 re-rendering이 되기 전에 re-evaluate(재평가)를 거친다. 먼저 새로운 state인 {name: "진도사우르스"}를 가지고 해당 컴포넌트(함수) 재실행(re-run)한다. 그 과정에서 컴포넌트 내부 구조는 모두 재생성(re-creation)하게 된다. 그런 뒤에 react가 변..