![](https://sousuke-neosoul.com/wp-content/uploads/2024/03/shirokuma_0829__multi_expressions__plant_male_fairy__illustrati_aec9d435-94c7-41e3-8e11-e3f1686b2c83_2000x2000-1.png)
運営者:そうすけ
愛媛在住のエンジニア兼ブロガー。
工場勤務から社内SEにキャリアチェンジ。
主に社内向けのシステム開発を行っています。
【ブログ運営歴】2021.6~
【プログラミング歴】2022.3~
本業:Java,MySQL、個人:Javascript
目次
Nuxt3のルーティング処理について
Nuxtはルーティング処理を別途かかずとも、フォルダ構成により自動でルーティング処理をしてくれます。
独学プログラマ
![](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
![](https://blog.cloud-acct.com/grobal-eyecatch.png)
Nuxt3で動的ルーティングを生成するには[id].vueを作成する – 独学プログラマ
Nxut3で動的ルーティングを生成するにはで囲まれたページファイルを作成することで動的ルーティングが生成されます。texpages├──index.vue├──products│├──id.vue<=動的ルー...
動的ディレクトリについてフォルダでもファイルでもいける
基本的には[id].vueを作成すると、そのディレクトリに移動します。
中はidでなくてもよくて、特に定義しなくても大丈夫です。
![](https://sousuke-neosoul.com/wp-content/uploads/2023/12/image-17.png)
フォルダを[id]にして、中にindex.vueでもできます。
![](https://sousuke-neosoul.com/wp-content/uploads/2023/12/image-16.png)
この方が詳細ID遷移先のページで深い階層に遷移できる設計ができます。
例えば商品ページに入るのは商品IDで、その中での詳細情報などでページ遷移させたい場合、この構成が役に立ちます。
コメント