Vue 3 路由器 - 路由器链接活动不工作

时间:2021-05-03 20:14:06

标签: vue.js vue-router vuejs3 vue-router4

在带有路由器 4 的 vue 3 中, this.actions$.pipe(ofType(fromCatsActions.Back), 类不再适合我。如果您与 router-link-active 位于同一页面上,则该类出现,但不在任何子页面上。

例如,链接 router-link-exact-active 获取的是 /test 上的 <router-link :to="{ name: 'test'}">test</router-link>router-link-active 类,但 /test/2 上没有它们强>

router-link-exact-active

真实例子: https://codesandbox.io/s/vue-router-4-reproduction-forked-zcb7y

谢谢,任何想法或建议

1 个答案:

答案 0 :(得分:0)

我错过了 https://github.com/vuejs/rfcs/blob/master/active-rfcs/0028-router-active-link.md#unrelated-but-similiar-routes,它有点隐蔽。显示的 RouterView 解决方法工作正常。这是我的示例:

import { h } from 'vue'
import { RouterView } from 'vue-router'

const routes = [
  {
    path: '/test',
    component: { render: () => h(RouterView) },
    children: [
      { 
        path: '',
        name: 'test',
        component: Test
      },
      { 
        path: '2',
        name: 'test-2',
        component: Test2
      }
    ]
  }
]