useParams
-
useParams()FW, Lib 공부/React 2022. 6. 22. 16:07
react-router-dom (v5.3.0 기준) useParams hook은 동적으로 움직이는 주소창에 있는 내용중 일부를 반환해준다. 반환하는 내용은 ... 에 있는 params를 반환해준다. 예로 들어 아래의 코드가 있다고 가정해보자. // Router.tsx // Coins.tsx // Coin.tsx const { coinId } = useParams(); Router.tsx에서 Route path의 형식을 /:coinId 라고 지정해줬다. 따라서 Coin.tsx에서 useParams를 이용해 받는 객체에서 키 이름은 coinId가 된다. 또한, Coins.tsx에서 Link to를 통해 코인 아이디 값을 넘겨준다. 만약 넘겨주는 값이 eth-ethereum 이라면, Coin.tsx에서 받는 ..