Nuxt.js ルーティング学習メモ

1. どうやってルーティングを設定するか

nuxt_study/pages/index.vueをコピーして、
nuxt_study/pages/tests/test.vueを作成する。

http://localhost:3000/tests/test

仕組みとしては、nuxt_study/pagesの下にファイルを作ればルーティングが自動設定される。
nuxt_study/.nuxt/router.js
※ ここは多分触らなくていい。

2. 動的ルーティング

nuxt_study/pages/index.vueをコピーして、
nuxt_study/pages/tests/_id.vueを作成する。

_id.vueのように最初にアンダースコアをつける。
適当な箇所に以下を記載して、URLの値が取れるかチェック。
http://localhost:3000/tests/aaaaaaaaaaaaaaaaaaaaaa

nuxt_study/pages/tests/_id.vue

{{ this.$route.params.id }}

「aaaaaaaaaaaaaaaaaaaaaa」が画面に表示されているのでOK。

バリデーションも設定してみたい所感

3. 参考

ありがとうございました。
https://qiita.com/futy_0123/items/a3180650f423fc3f2d36