[React] input값 state에 저장하기 e.target

 <input>에 입력한 데이터 가져오는 법

 

1

<input onChange={(e)=>{console.log(e.target.value)}}/>

cs

파라미터 'e'  추가해주고

e.target.value라고 적으면 현재 <input>에 입력된 값을 가져올 수 있음

 

◽ e : 이벤트 객체, 지금 발생하는 이벤트에 관련한 여러가지 기능 담겨있음, e뒤에 점찍고 기능들 붙일수있음
◽ e.target : 이벤트가 발생한 html 태그 == input 태그
◽ e.target.value :  html 태그에 입력한 값
◽ e.stopPropagation() : 상위html로 퍼지는 이벤트버블링 막고싶을 때, 보통 자식 태그에 씀

 

 

 

 

 

 사용자가 <input>에 입력한 데이터 state에 저장하기

 

사용자가 input에 입력한 데이터는 state 아니면 변수에 저장해서 쓰는 것이 일반적

state에 저장해보기

function App (){
 
  let [입력값, 입력값변경] = useState('');
 
  return (
    <input onChange={(e)=>{ 
      입력값변경(e.target.value) 
      console.log(입력값)
    }} />
  )
}