[React] useParams()

null·2023년 5월 3일
0

React

목록 보기
6/11

useParams()

---------------MovieDetail.js
import { useParams } from "react-router-dom";

const { id } = useParams();
// useParams() : Router는 바로 이 변수 값을 넘겨준다

// useParams()로 받아온 id를 이용해 API로부터 정보를 fetch `movie_id=${id}` 할 수 있다
const getMovie = async () => {
    const json = await (
       await fetch(`https://yts.mx/api/v2/movie_details.json?movie_id=${id}`)).json();
       
        setMovie(json.data.movie);
       
    };


---------------Movie.js
 import { Link } from "react-router-dom";
 
 
<Link to={`/movie/${id}`}>{title}</Link>
// backtick (``)으로 문자열을 감싸고 ${} 안에 변수나 표현식을 넣어 사용
  • useParams()
    : URL 매개 변수를 추출하는 React Router 훅

0개의 댓글