콘솔창에서 컴포넌트에서 props
로 받아오는 데이터를 출력해보니
정상적으로 배열에 추가된 것을 확인할 수 있었지만
바뀐 상태의 배열을 새로 화면에 렌더링하는 과정에서 오류가 발생한 것으로 보임
Amount
와 Date
반영되었지만 Title: '새로운 제품'
은 반영되지 않았고title: 휴지
가 그대로 들어가있는 상태Amount
의 값이 하나씩 뒤로 밀려남Tilte : '컵'
에 대한 컴포넌트가 하나 더 생성되었다하나의 컴포넌트를 여러 컴포넌트로 구성하다보니
props
를 전달하는 과정에서 실수가 있었음
그리고 기존에 title
을 상위 컴포넌트가 아닌
현재 컴포넌트에서 useState
를 이용해서 관리를 하려다가
상위 컴포넌트에서 props
로 전달받아 구성하기로 했었는데
이를 미처 title
에만 반영하지 못했음
그렇기때문에 다른 date
, amount
의 값은 잘 반영되었는지만title
에만 적용되지 못 했다
값이 제대로 반영되어 렌더링 되는 것을 확인할 수 있었음!
컴포넌트 props가 하위 컴포넌트까지 제대로 전달되지 못하고 또 중간에 제대로 활용되지 않으면 예상치 못 했던 문제가 발생하는 것을 확인했음
상태관리의 중요성을 느꼈음
리덕스나 리코일과 같은 상태관리 라이브러리 공부 필요할 듯