form state

제어 컴포넌트

input, textarea, select 값을 state에 연결하면 화면 입력과 React 데이터가 같은 기준으로 움직입니다.

value 연결

입력 요소의 value를 state에 묶어 화면 값의 출처를 React 안으로 가져옵니다.

onChange

사용자 입력이 발생할 때 setter를 호출해 state와 화면 값을 다시 맞춥니다.

여러 입력

name 속성과 단일 핸들러를 사용하면 여러 필드를 하나의 객체 state로 관리할 수 있습니다.

name

여러 필드가 어떤 state 키로 들어갈지 정한다.

select

선택값도 value와 onChange 흐름으로 맞춘다.

textarea

텍스트 영역도 children이 아니라 value로 제어한다.

ref

즉시 제어가 필요 없는 값은 비제어 방식도 비교한다.