e.target - React vs JavaScript

 

출처: https://dubaiyu.tistory.com/80 [프론트엔드 여행하려다 풀스택:티스토리]

 

    const onChange = (e) =>{
        console.log(e.target)
        console.log('e.target.name:'+e.target.name)
        console.log('e.target.value:'+e.target.value)
    }
    ...
    <input name="username" onChange={onChange} placeholder = "이름"/>
    <input name="nickname" onChange={onChange} placeholder = "닉네임"/>
    <button onClick={onReset}>초기화</button>

 

 

export default function UserList({testest}) {
    const [inputs, setInputs] = useState({
        username : '',
        nickname:''
    })
	const {username, nickname} = inputs;
    const onChange = (e) =>{
        // console.log(e.target)
        // console.log('e.target.name:'+e.target.name)
        // console.log('e.target.value:'+e.target.value)
    
        setInputs({
            ...inputs,
            [e.target.name]:e.target.value
        })
    }
    ...