我如何重定向到第一个子组件 vue router

Question

我正在研究 Vue 路由器。我有个问题。(SettingProfile)当我访问父组件时，我不想重定向到第一个子组件(settings)。

预期网址：localhost:8080/settings-->localhost:8080/settings/profile

这是我的路由器：

{
    name: 'settings',
    path: '/settings',
    component: () => import('./views/settings.vue'),
    children: [
    {
        path: 'profile',
        name: 'SettingProfile',
        component: () => import('./components/settings/profile.vue')
    },

    {
        path: 'account',
        name: 'account',
        component: () => import('./components/settings/account.vue')
    }
    ]
},

Answer 1

您可以添加重定向配置，例如：

{ path: '/settings', redirect: '/profile' }

也可以使用名称来完成。有关更多信息，请参阅文档。

Answer 2

这应该有效。

{
  path: '/parent-path',
  name: 'parent',
  component: () => import(/* webpackChunkName: "parent" */ '../views/Parent.vue'),
  redirect: { name: 'children' },
  children: [
    {
      path: 'child-path',
      name: 'children',
      component: () => import(/* webpackChunkName: "tasks" */ '../views/Child.vue'),
    },
  ]
}

已测试，这将自动重定向到/parent-path/child-path