Question

我有这样的路线结构：

routes: [
  {
     path: '/login', 
     name: 'Login', 
     component: Login
  },
  {
     path: '/', 
     component: Index, 
     redirect: '/riders', 
     children: [
        { 
           path: 'users', 
           name: 'Users', 
           component: Users
        },
        {
           path: 'owners', 
           name: 'Owners', 
           component: Owners
        },
        {  
           path: 'writers', 
           component: Writers, 
           redirect: '/junior', 
           children: [
              {
                 path: 'junior', 
                 name: 'Junior', 
                 component: JuniorWriters
              },
              {  
                 path: 'senior', 
                 name: 'Senior', 
                 component: SeniorWriters
              }
           ]
        } 
     ] 
  }
]

我的Users，Owners和Writers可通过索引组件中的导航栏访问，并且它们的组件在Index组件的部分中呈现。

在Writers组件中，我还有另一个嵌套junior和senior的地方。在Writers组件中可以访问用于加载JuniorWriters和SeniorWriters组件的链接。

但是，由于我的导航表位于整个父级的索引组件中，因此可以在所有组件中访问它。

当我导航到 / writers / junior（或高级） 时，将加载正确的组件，但是，如果我从导航选项卡中选择所有者或用户，则路径更改为 / writers / junior / owners （或用户）。

问题：

我该如何实现，以便路由在任何时候都是 / users 或 / owners 是从导航选项卡中选择的，而不管选择它们时的路径是什么？

Answer 1

在加载/writers/junior/owners或/users时路径更改为/owners，
因为您已经在父级中添加了redirect:'writers'字段，而该字段基本上是redirects的作者，并且writers也有一个redirect:junior字段，所以它重定向到writers / junior然后追加了owner，所以最终路径变成了{ {1}}。

您可以尝试类似的方法，提供writers/junior/owners而不是path:'/users'

path:'users'

Answer 2

我通过使用名称而不是：to的路径来修复它，即：to =“ {name：item.index}”

Vue无法从子路线导航到父路线的父路线

2 个答案: