Vue Router中 exact-active-class与active-class使用场景有什么区别?

clipboard.png

clipboard.png
就是这个所谓的精确匹配是什么意思没看懂。

阅读 7.3k
1 个回答

router-link 默认情况下的路由是模糊匹配,例如当前路径是 /article/1 那么也会激活 <router-link to="/article">,所以当设置 exact-active-class 以后,这个 router-link 只有在当前路由被全包含匹配时才会被激活 exact-active-class 中的class。

例如

<router-link to="/article" active-class="router-active"></router-link>

当用户访问 /article/1 时会被激活为

<a href="#/article" class="router-active"></a>

而当使用

<router-link to="/article" exact-active-class="router-active"></router-link>

当用户访问 /article/1 时,不会激活这个link的class

<a href="#/article"></a>
推荐问题