리액트) contains an input of type text with both value and defaultValue props

🙃오류 메세지

~ contains an input of type text with both value and defaultValue props.

 

 

👇 오류난 코드

const [username, setUsername] = useState('parkhacker');

<input
	type='text'
	defaultValue='parkhacker'
	value={username}
	placeholder='your username here..'
	className='tweetForm__input--username'
	onChange={handleChangeUser}
></input>

 

😄오류 해결 방법

➥ <input type="checkbox">와 <input type="radio">는 defaultChecked를 지원하고 <select>와 <textarea>는 defaultValue를 지원한다고 한다.

그래서 위의 defaultValue 값을 주석처리 해서 오류를 해결했다. 

(state의 초기값으로 원하는 값을 설정해줘서 문제 없다고 판단했다. )

 

 

👇 오류 해결한 코드

const [username, setUsername] = useState('parkhacker');

<input
	type='text'
	// defaultValue='parkhacker'
	value={username}
	placeholder='your username here..'
	className='tweetForm__input--username'
	onChange={handleChangeUser}
></input>

 

 

참고한 사이트

https://ko.reactjs.org/docs/uncontrolled-components.html

 

 

😃혹시나 잘못된 개념 전달이 있다면 댓글 부탁드립니다. 저의 성장에 큰 도움이 됩니다🤓