react hooks useState array push, pop, 배열 값 추가, 값 삭제

배열에 값 추가 시 ( push ) 

기존 코드

let arr = selectedCarList.push(newValue)
setSelectedCarList(arr)

추가하는 새로운 배열을 만들고 새 배열을 다시 set 해주는 코드를 짰었다. 이와 같이 짜니, selectedCarList가 useState를 사용한 객체여서 저렇게 push를 하면 값이 이상하게 변하였다.

수정한 코드

setSelectedCarList([...selectedCarList,value])

이와 같이 ‘three dots’ (점점점 ... ) 문법 사용하여 배열의 요소를 펼친다. 그 후 추가하는 값을 뒤에 붙여 push 한다.

배열에서 삭제 시 ( pop )

수정한 코드

setSelectedCarList(selectedCarList => selectedCarList.filter(item=> item !== value))

저번에 array관련해서도 이 에러를 겪었던 기억이 있는데 다시 또 실수하지 말자!

에러 해결 참고 https://stackoverflow.com/questions/54676966/push-method-in-react-hooks-usestate

useState array push, pop