✅ event값을 handling해서 타이핑 될 때마다 input에 값이 찍히게 하기 위해선 onchange함수를 써야한다. input태그 안에 value(input에 들어오는 값) 와 onchange이렇게 둘이 짝지어서 같이 다닌다.
--> ⭐input을 넣었다는 것은 input에 입력되는 값들을 핸들링 할 수 있는 state가 필요하다. 그 state 두개를 만들어 관리한다
---> ⭐버튼을 누르면 input에 입력되는 값을 state로 알 수 있다
const [inputValue, setInputValue] = useState("")
<input value = {inputValue}
onChange = {(e) => {setInputValue(e.target.value)}}/>
❓❓위 코드처럼 짜고 실행을 시켰는데 input 값이 object라고 고정이 되어있었다.
뭔가 잘못되었었고, 전에도 봤던 에러였던 것 같다.
<form>
<input
value={inputValue.title}
onChange={(e) => {
setInputValue(e.target.value);
}}
type="text"
/>
⭕내가 해결을 시도했던 방안이다.⭕
inputValue에 콘솔을 찍어봤더니, 객체 형태 즉 object로 되어있었다.
그래서 input창에 object라고 나왔었나보다
object에서 title값을 찾으려고 했으니 inputValue.title을 써서 그 값을 정확히 집어주니 값이 제대로 나왔다.
🍀알게된 점🍀
우리가 구할 값이 어떤 type인지 제대로 알고 적용을 하자
콘솔로 타입유형을 확인하는 방법이다. 구하고자하는 값 앞에typeof만 쓰면 된다.