CODEWITHSUNDEEP
nuxt.jsvue-routerrouternested-routes
Yosef
Yosef

Reputation: 281

Nuxt child: parent route works incorrectly

This is my files tree:

pages/
-index.vue   (1)
-index/
--_id.vue    (2)

I expect:

When I don't have a parameter for the child component I want the Nuxt child not to render at all, but Nuxt render it with id value of undefined. Vue router do it correctly.

This is JSFiddle like Nuxt behavior: https://jsfiddle.net/maxmets/95ctse8d/ (line 16 path: '/:id?')

This is JSFiddle I want (Vue router): https://jsfiddle.net/maxmets/rvmxg2f7/ (line 16 path: '/:id')

The different is only in ? symbol. When Nuxt automatically create object of routes it add ? How to make the Nuxt router work as correctly as the Vue router?

Upvotes: 0

Views: 1928

Answers (1)

zernonia
zernonia

Reputation: 188

You could try this Nested Route method:

pages/
-index.vue   (1)
-index/
--_id.vue    (2)
--_index.vue    (3)

In index/index.vue, you can just render empty template

<template>
  <div></div>
</template>

This maybe not be the cleanest way to do, but it should get the job done.

OR

But if you choose to define your own router, you can check out Nuxt Router Extra Module

Upvotes: 2

Related Questions