React Hook 객체 state 업데이트

최석훈·2021년 7월 17일
0
post-custom-banner

react hook에서 객체인 state를 업데이트 시키고 싶은데 헷갈려서 다른 사람들도 헷갈리지 않을까.. 싶어서 정리를 해본다.

const nameRef = useRef();
const ageRef = useRef();
const [data, setData] = useState(
	{
		name: "kunee",
        	age: 25,
	}
)

const onChange = (event)=>{
	const copies = {
    		...data,
            [event.target.name] : event.target.value, // ##### 
    	}
   setData(copies);
}


return (
	<input ref={nameRef} name="name" onChange={onChage}/>
	<input ref={ageRef} name="age" onChange={onChage}/>
)

위에 # 표시해 놓은 곳이 헷갈린 부분이다.
객체의 key부분이 정해진 것이 아니라 event처럼 바뀌는 값이라면 []없이 처리하면 오류가 난다.

profile
하루를 열심히
post-custom-banner

0개의 댓글