장바구니 완성: 개별 페이지로 이동

안녕하세요,

홈페이지에서 각각의 이미지를 누르면 라우팅을 이용하여 해당 페이지로 가는 문제를 풀었죠.

각각 이미지를 누를 경우 위 주소창에 

http://localhost:3000/detail/0

http://localhost:3000/detail/1

http://localhost:3000/detail/2

식으로 나오는 것을 했지요.  여기까진 제대로 되는데요,  내용은 항상 처음 것이 나오더군요. 위의 주소창의 주소만 바뀌었지 내용은 계속 첫 번째 것만 나오더라고요.

처음에는 제가 무슨 실수를 한 건줄 알았는데, 강의를 두 세번 보니 선생님께서 만드신 것도 똑같은 방식으로 작동되고 있는 것을 확인할 수 있었습니다. 

그래서 우선 App.js에서 data.js에서 제대로 받고 있는지 보기 위해서 콘솔로 찍어봤습니다. 

그리고 결과는 예상대로 다음과 같이 잘 나왔습니다. 

App.js에서 props로 Detail.js와 Card.js로 이것을 전달합니다. 

우선 Card.js에도 똑같이 콘솔로 찍어봤는데요, 제대로 나오는 것을 확인했습니다. 

근데 Details.js에서 콘솔로 찍어보면 이상하게 나옵니다. 

위에서 나오는 것과 같이 props로 받은 shoes의 첫 번째 아이템의 id가 number type이 아닌 string으로 나옵니다.  이게 도대체 어디서 온 것일까요?

또한 foundShoe는 undefined로 나옵니다. 

무엇이 잘 못된 것일까요?