Nested routes - with parent component

[marena]

Hi,

what is the best approach for include parent component in nested routes for specific pages:

{
    path:"/user/:id",
    component: user,
    children: [
      // UserHome will be rendered inside <router-view> User
      // when /user/:id matches
      { path: '', component: userHome },

      // ...other subpaths
    ],
  },

Using layouts? Or extending routes?

[posva]

You can do nested routes like this https://uvr.esm.is/guide/file-based-routing.html#nested-routes

[marena]

I guess I didn't make myself clear. For example, how can I replicate routes according to the example from vue-router. See below

<!-- User.vue -->
<template>
  <div class="user">
    <h2>User {{ $route.params.id }}</h2>
    <router-view />
  </div>
</template>

const routes = [
  {
    path: '/user/:id',
    component: User,
    children: [
      {
        // UserProfile will be rendered inside User's <router-view>
        // when /user/:id/profile is matched
        path: 'profile',
        component: UserProfile,
      },
      {
        // UserPosts will be rendered inside User's <router-view>
        // when /user/:id/posts is matched
        path: 'posts',
        component: UserPosts,
      },
    ],
  },
]

[posva]

That would be the same as I sent you with a files users/[id].vue and users/[id]/index.vue and a folder users/[id]

[marena]

Thank you very much, it works. I misunderstood from the documentation.