Home

Issue: 1542

How to specify the default child node to display in nested routes?

[issue link]

This is my pages structure. Im following the nested routes here.

image

The parent modules has two children - list and add. I want modules page to show the list by default in

/modules - should display the content from /modules/list

When custom route is added

extendRoutes (routes, resolve) {
      routes.push({
        name: 'custom',
        path: '/modules',
        component: resolve(__dirname, 'pages/index/modules/list.vue')
      })
    }

the router.js in .nuxt folder looks like

routes: [
  {
    path: "/",
    component: _e52ba1d4,
    name: "index",
    children: [
      {
        path: "modules",
        component: _65b38ce4,
        name: "index-modules",
        children: [
          {
            path: "list",
            component: _4b9eafa2,
            children: [
              {
                path: "",
                component: _57240f72,
                name: "index-modules-list"
              }
            ]
          },
          {
            path: "add",
            component: _2d9168c0,
            children: [
              {
                path: "",
                component: _7b049a23,
                name: "index-modules-add"
              }
            ]
          }
        ]
      }
    ]
  },
  {
    path: "/:id",
    component: _0a760204,
    name: "id"
  },
  {
    path: "/modules",
    component: _4b9eafa2,
    name: "custom"
  }
]

How can I do that? Display modules list in the /modules page?

This question is available on Nuxt.js community (#c1373)