在vue-router中要使用選中樣式的方法有兩種:
1、直接在路由js文件中配置linkActiveClass
2、在router-link中寫入active-class
問題:如果就這樣,那么會出現一個問題,不管跳轉到哪里,跳轉到根目錄的那個連接(to="/") 始終都會有選中樣式
為什么會這樣呢?查閱文檔:https://router.vuejs.org/zh-cn/api/router-link.html
知道了,如果只是添加選中樣式,那么只要是以to的值開頭的,都會激活選中樣式
to="/" to="/a" to="/b"
為了解決上面的問題,還需加入一個屬性exact,類似也有兩種方式:
1、直接在路由js文件中配置linkActiveClass
2、在router-link中寫入exact
好了,看看效果: