- 컴포넌트는 상호 작용의 결과로 화면 내용을 변경하는 경우가 많다.
- ex) 구매 버튼 => 장바구니 + 1, 다음(캐러셀) => 이미지 변경
- 이와 같은 것들을 기억해야 한다.
- 이런 종류의 컴포넌트 별 메모리를
state라고 부른다.
- 컴포넌트를 새 데이터로 업데이트 하려면 2가지 작업이 필요하다
- 렌더링 사이에서 데이터를 유지한다.
- 새로운 데이터로 컴포넌트를 렌더링하도록
React를 트리거하여 리렌더링을 발생시킨다. useState훅을 사용하여 이 작업을 수행할 수 있다.- 렌더링 사이 데이터를 유지하기 위한
state변수 - 그 변수를 업데이트하고 컴포넌트를 다시 렌더링하도록 트리거 역할을 하는
state setter함수 - 훅은
React가 렌더링 중일 때만 사용할 수 있는 특별한 함수이다. - 훅은 컴포넌트의 최상위 레벨 or 커스텀 훅에서만 호출해서 사용 가능하다.
- state는 격리되어있고,
private하다. - state를 선언하는 컴포넌트 외에는 완전히 비공개이며, 부모 컴포넌트도 이를 변경할 수 없다.
(이 섹션의 도전과제 풀어보는 거도 좋다)