[React, Next.js]URLパラメータを取得

はじめに

今回はReactとNext.jsでURLの情報を取得する方法を書いていきます。

Reactの場合

ReactでURLのパラメータを取得するには、「useLocation()」が使えます。
まずは、「react-router-dom」をインストールしてください。

npm install react-router-dom

以下がサンプルコードになります。
「localhost://3000/Favorite」の場合

const location = useLocation();
console.log(location);

結果☟

Next.jsの場合

Next.jsでURLのパラメータを取得するには、useRouter()が使えます。
以下がサンプルコードになります。
「localhost://3000/books」の場合

const router = useRouter();
console.log(router);

結果☟

参考

参考にしたドキュメントです。

最後に

他にも色々な記事を書いているので、よければ読んでいってください、、、