鍍金池/ 問答/HTML/ Vue Router中 exact-active-class與active-cl

Vue Router中 exact-active-class與active-class使用場景有什么區(qū)別？

clipboard.png

clipboard.png
就是這個所謂的精確匹配是什么意思沒看懂。

回答
編輯回答
胭脂淚

router-link 默認(rèn)情況下的路由是模糊匹配，例如當(dāng)前路徑是 /article/1 那么也會激活 <router-link to="/article">，所以當(dāng)設(shè)置 exact-active-class 以后，這個 router-link 只有在當(dāng)前路由被全包含匹配時才會被激活 exact-active-class 中的class。

例如

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

當(dāng)用戶訪問 /article/1 時會被激活為

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

而當(dāng)使用

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

當(dāng)用戶訪問 /article/1 時，不會激活這個link的class

<a href="#/article"></a>
2017年7月31日 08:51