[16] state Lifting

state Lifting

리액트는 단방향 데이터 흐름이다. 즉 부모만 자식에게 데이터를 줄 수 있고, 자식은 부모에게 데이터를 줄수 없다. 하지만 자식이 부모의 상태를 변경해야 한다면?

이 때 lifting state up 이라는 것을 사용한다.

  1. 상위 컴포넌트에서 state를 변경시키는 상태변경 함수를 만든다.
hadleState = () => {this.setState()}
  1. 이 함수는 자식에게 props로 넘긴다.
  2. 자식은 이 함수를 받아 사용하면 부모의 상태를 변경할 수 있다. 이 때 상태가 변경됨으로 다시 render가 실행된다.

이때 부모 컴포넌트에서 this 를 꼭 bind 해서 넘겨야한다. 그래야 부모의 상태를 변경할 수 있다.

아직 this 배우지 않아 위 용법이 와닿지 않는다.
아니면 아래와 같이 수업에서 배운 방법을 참고하자.

좋은 웹페이지 즐겨찾기