代码之家 › 专栏 › 技术社区 › Johnson

VueJS精确活动类

vue-router vue-component vuejs2 vue.js

Johnson · 技术社区 · 7 年前

<ul class="nav nav-second-level">
    <li v-for="item in menu">
        <router-link :to="{ name: somewhere }" tag="a" exact-active-class="IS-ACTIVATED">
            {{Name}}
        </router-link>
    </li>
</ul>

有没有办法使用“精确活动类”将类设置为父类?

2 回复 | 直到 7 年前

Quoc-Anh Nguyen 7 年前

您可以使用 v-if 检查您所在的路线,并在以下情况下添加类: $route.name somewhere

<ul class="nav nav-second-level">
     <li v-for="item in menu" :class="{ 'IS-ACTIVATED': $route.name === somewhere }">
         <router-link :to="{ name: somewhere }">
             {{Name}}
         </router-link>
     </li>
 </ul>

Ian Walter 7 年前

一种方法可能是:

<ul class="nav nav-second-level">
  <router-link :to="{ name: somewhere }" tag="li" exact-active-class="IS-ACTIVATED">
            {{Name}}
  </router-link>
</ul>

推荐文章

Goose · 如何更新Vue中的插槽。JS公司

6 年前

Scap · 访问其他组件中的vue组件数据时出现问题

6 年前

Andy · 从列表中删除vue组件始终删除列表中的最后一个元素

6 年前

Harshal Patil · 如何创建Vue。js插槽编程?

6 年前

kindisch · 无法解析动态导入的vue组件

6 年前

user1436631 · vueJS-当本地副本更新时,属性正在发生变化

6 年前

Willing Master · 如何配置选项以删除vue-tables-2中分页的第一个和最后一个按钮

6 年前

kshep92 · 将布尔属性传递给Vue组件的速记

6 年前

Bitwise · 将动态数据传递到路由器链路。

6 年前

user3699711 · 如何将数组中的元素添加到div元素中,其中id等于vue中的数组元素dealState号。js公司

6 年前