Javascript/React

[React] input value 값 수정 안될때 defaultValue

eulBlue 2024. 4. 5. 10:26

📱테스트 환경

"react": "18.2.0"
"react-dom": "18.2.0"
"typescript": "^4.9.5"

<Input /> 에 기본으로 텍스트를 넣어주기 위해 value 에 값을 넣어줬을 때

이후 값을 수정하려고 하면 값이 안들어가게 될 것이다.

그때는 당황하지 말고 value 를 defaultValue 를 사용하면 된다.

Before

<input autoFocus placeholder={"Post Title"} value={title} onChange={(e) => {setTitle(e.target.value)}}/>

After

<input autoFocus placeholder={"Post Title"} defaultValue={title} onChange={(e) => {setTitle(e.target.value)}}/>