Jaeilit

인풋 여러개 쓰기 REACT 본문

TIL

인풋 여러개 쓰기 REACT

Jaeilit 2021. 10. 28. 17:28
728x90

 

변경 전에는 useState를 반복적으로 인풋만큼 4개를 사용했다.

하지만 여러개를 하나로 압축시키는 법을 알고 나서는 하나로 썼다.

 

하나로 하는 방법

 

useState 하나에 값을 userid, username, password 등 나열한다.

이 값들은 input 의 name 속성과 일치해야 할 것이다.

 

그 inputvalue 들을 비구조화 할당으로 하나씩 까놓고

onChange 함수에 e.target.value 를 이용해서

 

e.target 또 한 까놓는다.

 

name과 value로

 

지금 그 name은 아까 인풋의 name과 일치해놓은 그 부분이고 value는 값이 된다.

 

바뀐 값을 받아 올 setInputValue({}) 안의 불변성을 위해서 ...inputValue를 한번 불러온 뒤에 해당 값만 덮어씌운다.

 

728x90