2020-05-15 Vue中路由设置路由高亮,

2020-05-15  本文已影响0人  流泪手心_521

linkActiveClass

类型: string

默认值: "router-link-active"

全局配置 <router-link> 默认的激活的 class。
通过 默认vue-router提供的类名 router-link-active 设置选中路由高亮的两种方式
1.结构

<ul class="nav-left">
                <router-link :to='{name: "home"}' tag="li" exact>首页</router-link>
                <router-link :to='{name: "know"}' tag="li" exact>知识</router-link>
                <router-link :to='{name: "askAnswer"}' tag="li" exact>问答</router-link>
                <router-link :to='{name: "expert"}' tag="li" exact>专家</router-link>
            </ul>

2.样式

 li.router-link-active{
          border-bottom: 2px solid #ff8635;
 }

第二个问题,路由跳转,假如没有一级路由,二级路由就是一级路由,直接配一级路由就可以了

上一篇下一篇

猜你喜欢

热点阅读