美文网首页
2020-05-15 Vue中路由设置路由高亮,

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

作者: 流泪手心_521 | 来源:发表于2020-05-15 11:10 被阅读0次

    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;
     }
    

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

    相关文章

      网友评论

          本文标题:2020-05-15 Vue中路由设置路由高亮,

          本文链接:https://www.haomeiwen.com/subject/ttaqohtx.html