vue點(diǎn)擊當(dāng)前路由高亮小案例
更新時(shí)間：2019年09月26日 10:44:57 作者：小羽向前跑
這篇文章主要為大家詳細(xì)介紹了vue點(diǎn)擊當(dāng)前路由高亮小案例，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
本文實(shí)例為大家分享了vue點(diǎn)擊當(dāng)前路由高亮的具體代碼，供大家參考，具體內(nèi)容如下
功能展示：
組件代碼：
標(biāo)簽上加exact
.router-link-active{
background: rgba(255,255,255,0.8);
color: gray;
}
<template>
<nav>
<ul>
<li>
<router-link to="/" exact>博客</router-link>
<router-link to="/AddBlog" exact>寫博客</router-link>
</li>
</ul>
</nav>
</template>
<script>
export default {
name: "bolgheader"
}
</script>
<style scoped>
ul{
list-style-type: none;
text-align: center;
margin:0;
}
li{
display: inline-block;
margin:0 10px;
}
a{
color:rgb(102, 119, 204);
text-decoration: none;
padding:12px;
border-radius: 5px;
font-size:20px;
}
nav{
background: #eee;
padding: 30px 0;
margin-bottom: 40px;
}
.router-link-active{
background: rgba(255,255,255,0.8);
color: gray;
}
</style>
以上就是本文的全部內(nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
本文主要介紹了Vue3怎么使用element-plus，文中通過示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-11-11
Vue3使用customRef封裝防抖函數(shù)的方法詳解
防抖函數(shù)的作用是高頻率觸發(fā)的事件,在指定的單位時(shí)間內(nèi),只響應(yīng)最后一次,如果在指定的時(shí)間內(nèi)再次觸發(fā),則重新計(jì)算時(shí)間,本文將給大家詳細(xì)的介紹一下Vue3使用customRef封裝防抖函數(shù)的方法,需要的朋友可以參考下2023-09-09
這篇文章主要為大家介紹了Vue中使用Teleport的方法示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-08-08
vue中使用better-scroll實(shí)現(xiàn)滑動(dòng)效果及注意事項(xiàng)
這篇文章主要介紹了vue中使用better-scroll實(shí)現(xiàn)滑動(dòng)效果，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-11-11
vue基于better-scroll實(shí)現(xiàn)左右聯(lián)動(dòng)滑動(dòng)頁面
這篇文章主要介紹了vue基于better-scroll實(shí)現(xiàn)左右聯(lián)動(dòng)滑動(dòng)頁面，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-06-06
Vue3中使用vuedraggable拖拽實(shí)戰(zhàn)教程
這篇文章主要介紹了Vue3中使用vuedraggable拖拽實(shí)戰(zhàn)教程,文中通過示例介紹了vue3拖拽組件vuedraggable的使用demo，需要的朋友可以參考下2023-06-06
tdesign-vue是TDesign 適配桌面端的組件庫，適合在 vue 2 技術(shù)棧項(xiàng)目中使用，這篇文章主要介紹了vue項(xiàng)目中使用TDesign?,需要的朋友可以參考下2023-04-04
Vue.js實(shí)戰(zhàn)之組件的進(jìn)階
組件（Component）是 Vue.js 最強(qiáng)大的功能之一，之前的文章都只是用到了基本的封裝功能，這次將介紹一些更強(qiáng)大的擴(kuò)展。這篇文章主要介紹了Vue.js實(shí)戰(zhàn)之組件進(jìn)階的相關(guān)資料，需要的朋友們可以參考借鑒，下面來一起看看吧。2017-04-04
這篇文章主要介紹了vue?vue-esign簽字板的實(shí)例講解，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
在Vue.js應(yīng)用中實(shí)現(xiàn)分布式搜索和全文搜索
分布式搜索和全文搜索在現(xiàn)代應(yīng)用程序中變得越來越重要,因?yàn)樗鼈兛梢詭椭脩艨焖俨檎液蜋z索大量數(shù)據(jù),Elasticsearch是一種強(qiáng)大的分布式搜索引擎,本文將介紹如何在Vue.js應(yīng)用程序中實(shí)現(xiàn)分布式搜索和全文搜索,以及如何與Elasticsearch集成,需要的朋友可以參考下2023-11-11