props는 부모에서 자식으로 내려가는 읽기 전용 입력이다
자식은 받은 값을 직접 바꾸지 않고 렌더에 사용한다. 변경이 필요하면 부모가 넘긴 callback으로 요청을 올린다.
parent
data owner
값과 변경 함수 보유
props
read-only input
자식에게 전달
child
render
받은 값으로 화면 구성
callback
event up
변경 요청을 부모로
흐름
책임
흔한 실수
data down
부모가 값 결정
자식에서 props 변경 시도
event up
자식이 요청 전달
상태 위치 혼동
default
없을 때 값 처리
undefined 화면 노출
derived UI
props로 계산
복사 state 남발