Osman Rafi
Osman Rafi

Reputation: 1046

How to define vue routers with dynamic child routes?

I am trying something like this

{
    path: "/portfolio",
    component: () =>
      import("../common/components/Layout/Layout/Profile/ProfileLayout"),
    meta: { requiresAuth: false },
    children: [
      {
        path: "/:username",
        component: () =>
          import(/*webpackChunkName: "profile"*/ "../modules/Profile/Profile"),
      },
    ],
},

But the piece of code is not working while routes without child routes working perfectly

{
  path: "/profile/:userName",
  component: () => import("../modules/profile/UserProfile"),
}

how can i solve the first piece of code ?

Upvotes: 1

Views: 270

Answers (1)

Boussadjra Brahim
Boussadjra Brahim

Reputation: 1

You should remove the prepended slash from the child route path :

path: ":username",

or try out :

path: "user/:username",

then you could visit the url like /portfolio/user/john

Upvotes: 1

Related Questions