【Nuxt3】動的ルーティングはファイルもフォルダも対応できる

運営者:そうすけ


30代のブロガーとエンジニア。
工場勤務→情シス→ソフトウェアエンジニア
主にフロントエンド開発を行っています。

趣味はガジェットと植物

目次

Nuxt3のルーティング処理について

Nuxtはルーティング処理を別途かかずとも、フォルダ構成により自動でルーティング処理をしてくれます。

動的ディレクトリについてフォルダでもファイルでもいける

基本的には[id].vueを作成すると、そのディレクトリに移動します。

遷移先のページでuseRoute関数をでidを指定すると、URLからキーが引っ張ってこれます。

中はidでなくてもよくて、特に定義しなくても大丈夫です。

フォルダを[id]にして、中にindex.vueでもできます。

この方が詳細ID遷移先のページで深い階層に遷移できる設計ができます。

例えば商品ページに入るのは商品IDで、その中での詳細情報などでページ遷移させたい場合、この構成が役に立ちます。

参考書籍

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

コメント

コメントする

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

目次