리액트 라우터 3 과제 질문

import { useParams } from "react-router-dom";
function Detail(props) {
  let { id } = useParams();
  for (let i = 0; i < props.shoes.length; i++) {
    if (id == props.shoes[i].id) {
      return (
        <div className="container">
          <div className="row">
            <div className="col-md-6">
              <img
                src="https://codingapple1.github.io/shop/shoes1.jpg"
                width="100%"
              />
            </div>
            <div className="col-md-6">
              <h4 className="pt-5">{props.shoes[id].title}</h4>
              <p>{props.shoes[id].content}</p>
              <p>{props.shoes[id].price}</p>
              <button className="btn btn-danger">주문하기</button>
            </div>
          </div>
        </div>
      );
    }
  }
}
export default Detail;

숙제 내주신거 요렇게 해도 되나요?