vue-router中的router-link的active-class


在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

  

 

  

  好了,看看效果:

    


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM