vue-router為激活的路由設(shè)置樣式操作
更新時(shí)間：2020年07月18日 10:03:11 作者：丶Eric
這篇文章主要介紹了vue-router為激活的路由設(shè)置樣式操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
1.首先先寫好類名
2.在router里的js文件中添加 linkActiveClass:'active'
補(bǔ)充知識(shí)：記錄vue遇到問題，子頁面沒有router-link對(duì)應(yīng)導(dǎo)航欄激活樣式
如下所示：
li><router-link to="/basicSearch" :class="{'link-active':linkBoolean}">基礎(chǔ)檢索</router-link></li>
data () {
return {
imgUrl,
linkBoolean:false
}
},
created(){
if(this.$route.path == "/storeDetails" || this.$route.path == "/utxoDetails" ||
this.$route.path == "/blockAllDetails"){
this.linkBoolean = true
}
},
根據(jù)Router中子頁面鏈接名稱，指定對(duì)應(yīng)上級(jí)頁面的導(dǎo)航樣式是否激活
以上這篇vue-router為激活的路由設(shè)置樣式操作就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了vue2.x對(duì)象深層劫持的原理實(shí)現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-01-01
vue中使用elementui實(shí)現(xiàn)樹組件tree右鍵增刪改功能
這篇文章主要介紹了vue中使用elementui實(shí)現(xiàn)對(duì)樹組件tree右鍵增刪改功能,右擊節(jié)點(diǎn)可進(jìn)行增刪改，對(duì)節(jié)點(diǎn)數(shù)據(jù)進(jìn)行模糊查詢功能，本文給大家分享了完整代碼，需要的朋友可以參考下2022-08-08
vue3中使用keepAlive緩存路由組件不生效的問題解決
這篇文章主要介紹了vue3中使用keepAlive緩存路由組件不生效的問題解決,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2024-06-06
這篇文章主要為大家介紹了Vue3模板引用的操作方式示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-06-06
前端使用print.js實(shí)現(xiàn)打印功能(基于vue)
最近新接了一個(gè)需求,想要在前端實(shí)現(xiàn)打印功能,下面這篇文章主要給大家介紹了關(guān)于前端使用print.js實(shí)現(xiàn)打印功能(基于vue)的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-05-05
Vue3項(xiàng)目中reset.scss模板使用導(dǎo)入
這篇文章主要為大家介紹了Vue3項(xiàng)目中reset.scss模板使用導(dǎo)入示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-09-09
使用vue實(shí)現(xiàn)HTML頁面生成圖片的方法
這篇文章主要介紹了使用vue實(shí)現(xiàn)HTML頁面生成圖片的相關(guān)知識(shí)，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-03-03
Vue項(xiàng)目打包部署到apache服務(wù)器的方法步驟
這篇文章主要介紹了Vue項(xiàng)目打包部署到apache服務(wù)器，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-02-02
使用Vue動(dòng)態(tài)生成form表單的實(shí)例代碼
這篇文章主要介紹了使用Vue動(dòng)態(tài)生成form表單的實(shí)例代碼,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2018-04-04
利用vue.js實(shí)現(xiàn)被選中狀態(tài)的改變方法
下面小編就為大家分享一篇利用vue.js實(shí)現(xiàn)被選中狀態(tài)的改變方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-02-02