useparams를 쓰고있는데

[김재호]

function Detail(props) {
let {id} = useParams();
let history = useHistory();
return(
<div className="container">
<div className="row">
<div className="col-md-6">
<img src={"https://codingapple1.github.io/shop/shoes"+(id+1)+'.jpg'} width="100%" />

useParams 를 이용해서 이미지에 id파라미터를 이용하려고 위처럼 작성했는데 인식을 못하네요... {id} 객체형태로 입력해줘서그런건가요??

https://drive.google.com/file/d/1SuH_Al0lUVaSMbpGMUVMtWyRIwdVbuLu/view?usp=sharing

[codingapple]

강의에선 URL에 /detail/1 이라고 입력하면 id가 1이 나오도록 코드를 짰을겁니다.

id를 출력해봐도 안나오면 URL을 제대로 입력하지 않은게 아닐까요 

코드는 별문제없어보입니다

[codingapple]

가 아니라 콘솔창에 id+1을 한번 출력해보시면 알 수 있을 듯 합니다

[김재호]

코드는 별문제 없다니 다행이네용. 감사합니다. 일단은 그냥 id값 이용하는게 장기적으로 깔끔할 것 같아요!해결했습니다.

[윤부관]

저도 이부분 혼자 고민하고 있었습니다. 강의중에 만약에 홈페이지에 가격별 정렬이나 다른 경우에 shoes 라는 array 에 index 번호가 바뀔 수 가 있으니 id랑 비교해서 참일 경우 그 값을 return 하게 하시길래. 이미지에도 그렇게 해야겠다 싶어서

이렇게 방법을 찾았습니다!

도움 되시길 바래요!

<img
            src={
              "https://codingapple1.github.io/shop/shoes" +
              (findItem.id + 1) +
              ".jpg"
            }

[글쓴이]

글