Skip to main content

[React] Controlled Components

· One min read
  • 원문: Controlled Components
  • 두가지 상태
    • HTML도 자체 상태를 갖는 컴포넌트들이 있다 (form element들)
    • React는 mutable state를 각 component가 유지하며 setState()로 업데이트 한다
  • 상태의 'Single source of truth'를 위해 React state로 합친다
  • react 제어하에 들어간 input form element를 controlled component라 부른다
  • 원문은 class component기준으로 설명하지만 functional component 기준 설명도 있다. useState() hook을 사용
  • value라는 하나의 field를 갖는 state를 예로들었다(text type의 input의 값)
    • input의 onchange에서 현재값을 react component의 state로 넣어야 할 것이고
    • state의 값을 input의 value로 넣어야 할 것이다