I have this page route in NuxtJS:
pages/_book.vue
So that when I go to localhost:3000/my-book
, params.book
is equal to “my-book” as expected.
However some books are nested deep inside several directories. I want to get the full route as params.book
. These routes should be separated by “/”. For example, localhost:3000/finance/strategies/experts
should make params.book
equal to “finance/strategies/experts”.
How can I achieve this?
Note that since the directory structure is unknown (i.e. I can’t just create a structure like pages/_book/_type/_level.vue
)
Advertisement
Answer
You can use Unknown Dynamic Nested Routes to match routes that are not caught by other patterns.
With this file tree:
pages/ --| people/ -----| _id.vue -----| index.vue --| _.vue --| index.vue
It will behave like this
/ -> index.vue /people -> people/index.vue /people/123 -> people/_id.vue /about -> _.vue /about/careers -> _.vue /about/careers/chicago -> _.vue