文章詳情頁
vue-router為激活的路由設(shè)置樣式操作
瀏覽:3日期:2023-01-05 08:15:43
1.首先先寫好類名
2.在router里的js文件中添加 linkActiveClass:’active’
補(bǔ)充知識:記錄vue遇到問題,子頁面沒有router-link對應(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中子頁面鏈接名稱,指定對應(yīng)上級頁面的導(dǎo)航樣式是否激活
以上這篇vue-router為激活的路由設(shè)置樣式操作就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持好吧啦網(wǎng)。
標(biāo)簽:
Vue
相關(guān)文章:
1. css進(jìn)階學(xué)習(xí) 選擇符2. HTML <!DOCTYPE> 標(biāo)簽3. css代碼優(yōu)化的12個技巧4. 低版本IE正常運(yùn)行HTML5+CSS3網(wǎng)站的3種解決方案5. 使用css實(shí)現(xiàn)全兼容tooltip提示框6. CSS3實(shí)例分享之多重背景的實(shí)現(xiàn)(Multiple backgrounds)7. CSS Hack大全-教你如何區(qū)分出IE6-IE10、FireFox、Chrome、Opera8. 詳解瀏覽器的緩存機(jī)制9. HTML DOM setInterval和clearInterval方法案例詳解10. 告別AJAX實(shí)現(xiàn)無刷新提交表單
排行榜
