- Props와 State 차이점을 알아야한다
Props는 사용자가 사용하는 장치, State는 개발자가 사용하는 내부적인 조작장치이다.
Props는 컴포넌트 사용자에게 중요한 정보다. 사용자에게 알 필요도 없고 컴포넌트 내부적으로 사용하는 것들을 State라고 한다.
다양한 일들을 할 수 있는 컴포넌트를 만들 때 State를 만든다.
- App.js State사용하여 리펙토링하기
현재 App컴포넌트에 하위 컴포넌트로 Subject, Toc, Content가 있다. Subject 컴포넌트에 Props값으로 title이 있고 sub가 있는데 이것을 State로 빼서 리펙토링을 한다.
Constructor는 생성자 함수인데 컴포넌트들이 render되기 전 생성자 함수에서 필요한 값을 먼저 초기화 해야 한다.
마찬가지로 생성자 함수에서 먼저 state를 초기화 한다. 그리고 Subject 컴포넌트에 Props값으로 State변수를 전달할 때에는 중괄호를 사용하여 전달한다.
즉 App 컴포넌트가 내부적으로 사용하는 변수들이 State에서 관리한다. 또한 상위 컴포넌트(App)에서 하위 컴포넌트(Subject)에 Props를 전달할 때에는 State값으로 전달하는 것은 가능하다.
알고리즘 정리 블로그입니다.