리액트 - State Lifting (State-끌어올리기)

Jeong-Taek·2022년 9월 17일
0

> State Lifting

지지난 글에서 React - Props에 대해 살펴본적이 있다.
props는 부모컴포넌트에서 자식컴포넌트로 데이터를 전달할 때 사용된다.
리액트에서는 기본적으로 단방향 데이터흐름이라는 원칙이 있다.

리액트에서 단반향 데이터 흐름인 이유

1.단반향 데이터 흐름이 아닐경우 변경사항에 대한 코드를 계속 작성해야 한다.
2. 코드의 흐름을 알기 쉬우며 복잡해지지 않는다.
3. 가장 상단에 있는 부모컴포넌트의 값만 바꿔주면 UI가 자동으로 변경되게 할 수 있다.
(자소 중앙집권적, 중요한데이터 하나가 변경되었을 때, 많은 컴포넌트에 영향을 주는 것을 굳이 작성하지 않아도 된다.

자식 컴포넌트에서 어떤 이벤트로 인해 상위 컴포넌트의 상태가 바뀌는 것에 대하여 리액트가 제시하는 해결책을 보면..

"상위 컴포넌트의 '상태를 변경하는 함수' 그 자체를 자식 컴포넌트로 전달하고, 이 함수를 자식 컴포넌트가 실행한다."

이 방법도 여전히 단방향 데이터 흐름에 원칙에 부합하는 해결방법이다. 바로 이것이 "상태 끌어올리기"이다.

0개의 댓글