[Vuejs]-Vue3 Redirect with dynamic property

by

4👍

✅

Use the object form of redirect to specify the route by name, so that the parameters are automatically passed along:

export default createRouter({
  history: createWebHistory(),
  routes: [
    {
      path: '/',
      component: HelloWorld
    },
    {
      path: '/admin/operations/job-allocation/:id',
      name: 'JobAllocation',
      props: true,
      component: () => import('@/views/admin/operations/job-allocation/index.vue'),
      children: [
        {
          path: '',
          redirect: {
            name: 'JobAllocationOperatives', 👈
          },
        },
        {
          path: '/admin/operations/job-allocation/:id/operatives',
          name: 'JobAllocationOperatives',
          alias: 'Operatives',
          component: () => import('@/views/common/Operatives.vue')
        }
      ]
    }
  ]
})

demo

👤tony19

Leave a comment