vue中router菜單高亮

vue中使用router實現菜單高亮

因爲之前一直是用點擊控制class的方式寫的,沒有遇到問題,也沒有bug。今天寫的時候終於出現了bug,刷新頁面高亮菜單爲默認值,導致很久才能解決這個bug,記一次vue頁面刷新高亮菜的爲默認值的bug。

話不多說直接上代碼

方法一:

在router中選中的router-link會默認添加樣式

router-link-exact-active router-link-active

所以直接給這兩個當中的一個添加高亮樣式即可,router-link-exact-active是精準匹配模式, router-link-active普通模式

方法二:

或者在route.js中直接添加一個mui-active類名,然後設置mui-active的樣式即可,這個類名可以隨機設置

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章