부모 컴포넌트 A와 자식 컴포넌트 B가 있습니다. 컴포넌트 A는 state로 {name: "르탄이"}를 가지고 있고,
자식인 컴포넌트 B에게 name 값을 넘겨주었습니다. 컴포넌트 B는 받아온 name을 화면에 뿌려주고 있습니다.
컴포넌트 A의 state가 {name: "진도사우르스"}로 바뀌었을 때,
어떤 과정을 거쳐 바뀐 값을 화면에 보여주는 지 라이프 사이클 흐름을 그려볼까요?
1. setState()에 의하여 부모 컴포넌트A의 State가 변경된다.
2. 부모 컴포넌트가 리렌더링된다.
3. 바뀐 State를 props로 자식 컴포넌트에게 넘겨준다.
4. 자식 컴포넌트가 리렌더링된다.
5. 바뀐 부분에 대해 페이지가 그려진다.
'1차 공부 > React공부' 카테고리의 다른 글
| 라이프사이클 메소드를 사용할 수 없는 함수 컴포넌트에서 event listener을 해제 할때 (0) | 2022.11.29 |
|---|---|
| 양방향 바인딩은 무엇일까요? (0) | 2022.11.29 |
| 유사배열과 배열의 차이는? / 유사배열의 각 요소를 수정하고 싶다면? (0) | 2022.11.28 |
| 컴포넌트 분리해서 구현하기 (0) | 2022.11.26 |
| map 사용예제 (0) | 2022.11.26 |