본문 바로가기

FrontEnd/React

useParam에 대하여

 

 

usePrams이란? react-router-dom 에 있는 훅으로 URL의 동적 파라미터를 반환한다. 예를들면 아래와 같다.  여러개의 상품이 나열되어 있는 페이지에서 특정상품을 클릭하면 그 상품과 관련된 상세 페이지로 이동하게 구현한다고 해보자.

이와 같은 여러개의 상품이 나열되어 있는 페이지에서 특정 상품을 누르면 Link태그에 의해 해당 URL로 이동하게 된다.

 

그렇게 이동된 페이지에서 useParam()을 사용하면 현재 주소의 동적 url만을 가져오는 것이다. 즉 아래 그림에서 params변수는 현재 주소의 동적url인 p1을 값으로 갖게 되는 것이다.