[React & 가계부프로젝트] warning뜨면서 input이 비활성화 된 것처럼 안써질때 (value/defaultValue)

Warning: You provided a value prop to a form field without an onChange handler. This will render a read-only field. If the field should be mutable use defaultValue. Otherwise, set either onChange or readOnly

 

해결1. defaultValue로 바꿔주기

<input type="text" defaultValue="" placeholder="사용처" />

하지만 onChange를 같이 사용하면 값이 정상적으로 바뀌지 않는다.

 

해결2. onChange와 같이 사용하기 (추천)

<input type="text" value="" placeholder="사용처" onChange={handleUpdateInputValue}/>

 

defaultValue뿐만 아니라 defaultChecked도 동일한데, 이때는 default값이 설정이 필요하다면 default로, 계속 변경을 감지하여 v-model처럼 값 바꾼걸 사용한다면 onChange를 사용하고 value로 바꿔주면 된다.