Nuxt•6mo ago

Same component for two routes breaks layout

Using Nuxt3 with Client Side rendering. I have a componentecalled UserForm.vue that I use in 2 routes using custom routing like this:

  // router.js
  {
    path: '/admin/users/add',
    name: 'admin-users-add',
    file: '@/components/Admin/UserForm.vue',
  },
  {
    path: '/admin/users/:id/change',
    name: 'admin-users-id-change',
    file: '@/components/Admin/UserForm.vue',
  },

  // router.js
  {
    path: '/admin/users/add',
    name: 'admin-users-add',
    file: '@/components/Admin/UserForm.vue',
  },
  {
    path: '/admin/users/:id/change',
    name: 'admin-users-id-change',
    file: '@/components/Admin/UserForm.vue',
  },

I have set a custom layout inside the component:

definePageMeta({
  layout: 'admin',
});

definePageMeta({
  layout: 'admin',
});

But when I navigate to one of the routes, it renders the default.vue layout instead of the admin one

1 Reply

JuanMCeOP•6mo ago

I'm using the pages:extend hook

Gaming

Programming

Same component for two routes breaks layout

Did you find this page helpful?