router

router

在 Vue Router 中，router-link-active 和 router-link-exact-active 是两种用于指示当前激活路由的 class 名称。

router-link-active 会在当前路由匹配到的路由及其子路由上添加，而 router-link-exact-active 仅在当前路由完全匹配时添加。

举例来说，假设有如下路由配置：

const routes = [{ path: '/', component: Home },{ path: '/about', component: About },{ path: '/user', component: User, children: [{ path: '', component: UserProfile },{ path: 'posts', component: UserPosts },{ path: 'settings', component: UserSettings }]}
]

那么当访问 / 路径时，以下元素都会匹配到 router-link-active：

<router-link to="/">Home</router-link>
<router-link to="/about">About</router-link>

而只有以下元素会匹配到 router-link-exact-active：

<router-link to="/" exact>Home</router-link>
<router-link to="/about">About</router-link>

这是因为 / 路径完全匹配，而 /about 路径只是部分匹配。

因此，当需要在当前路由及其子路由上添加激活 class 时，可以使用 router-link-active，而当需要仅在当前路由完全匹配时添加激活 class 时，可以使用 router-link-exact-active。