Front End/React
이벤트핸들러함수 onChange = {handleChange}, onChange = {e => handleChange(e)}
YJ_SW
2022. 11. 28. 15:39
728x90
이벤트핸들러 함수
만약 이벤트 핸들러가 이벤트 객체에 대해 하나의 인수만을 갖는다면
이벤트 핸들러 함수를 onChange = {handleChange} 이런식으로 선언해도 된다.
onChange = {e => handleChange(e)} 이런식으로 익명 함수로 묶을 필요가 없다.
나쁜 예:
export const Name = () => {
const [name, setName] = useState('')
const handleChange = e => {
setName(e.target.value)
}
return (
<>
<input value={name} onChange={e => handleChange(e)} />
</>
)
}
좋은 예:
export const Name = () => {
const [name, setName] = useState('')
const handleChange = e => {
setName(e.target.value)
}
return (
<>
<input value={name} onChange={handleChange} />
</>
)
}
728x90