리액트 라우터 3번째 강의 질문드립니다.

[MD]

function Detail(props) {

let history = useHistory();
let { id } = useParams();

return (
   <div className="container">
         <div className="row">
              <div. className="col-md-6">
                  <img src={ "https://codingapple1.github.io/shop/shoes" + (id+1) + ".jpg" }

 

url 파라미터를 이용해서 상세 페이지 여러 개 보여주기 강의 공부하고 나서 수업내용 중에 이미지가 바뀌는건 없길래 위에 보이는 것처럼 코드를 짜봤는데 이미지가 보이지가 않더라구요. 

 

/detail/0 하면 shoes1이 보여져야 하니까 id+1 을 해준건데 0, 1,2 세 개로 다 접속해봐도 사진이 세 개 다 안 뜹니다 ㅠㅠ 

 

어디서 잘못된걸까요?

[codingapple]

id가 숫자가 아니라 문자인가봅니다 숫자로 바꿉시다 

[MD]

오옹... 그런데 props.product[id].price 여기서도 id를 바로썼는데 id가 문자여도 가능한가요?

숫자로 바꿔주니 정상적으로 되네요. 전 위에서 바로 id로 사용하기에 id가 숫자인 줄 알았는데..ㅠㅠ

[codingapple]

그건 될듯요 

[글쓴이]

글