리액트 state lifting

리액트 state 끌어올리기(react lifting state up)

기본적으로 리액트의 구조는 위에서부터 아래로, 부모에서 자식으로 흐른다.

하향식, 단방향 데이터 흐름
강제는 아닌 추천

받기만 하지 상위의 state의 컨트롤을 할 수 없다. setState는 내부의 state만을 업데이트 시킬뿐.

이럴 때 자식컴포넌트에서 부모의 상태를 변경 시키려면 콜백함수로 props를 전달하는 것이다.
인자로 보내지는 콜백함수는 바로 내부 state를 변동 시키는 setState가 포함된 함수이며 해당 콜백함수를 자식에게 보내주고, 자식에서 해당 함수를 호출하면 부모의 state가 변동되는 원리.

또 하나의 상태가 여러 컴포너틑에 영향을 준다면, 해당 컴포넌트들간의 가장 가까운 공통의 상위 컴포넌트에 상태를 끌어올리는것.

이것을 리액트 끌어올리기라고한다.

React에서 제시한 방법은 상위 컴포넌트에 정의된 상태를 변경하는 함수(handler) 자체를 하위 컴포넌트에 props로 전달하고, 하위 컴포넌트에서 이 콜백 함수를 실행하는 것이다.