Question

我对下拉分隔线有问题，我在vuejs上使用了引导程序，并且我有一些列表项，我将在该列表之间添加一行，因此我使用了<ul class="navbar-nav"> <li class="nav-item" v-for="nav in navbar" :key="nav"> <nuxt-link :to="nav.link" class="nav-link">{{ nav.item }}</nuxt-link> <div class="dropdown-divider"></div> </li> </ul>类，它可以工作，但是我要删除最后一行，我该怎么做？

这是我的代码：

shadow-none

Answer 1

您可以使用index属性。

<ul class="navbar-nav">
  <li class="nav-item" v-for="(nav, index) in navbar" :key="nav">
     <nuxt-link :to="nav.link" class="nav-link">{{
            nav.item
     }}</nuxt-link>
     <div class="dropdown-divider" v-if="index !== (navbar.length - 1)"></div>
  </li>
</ul>

如何删除Vue.js列表项中的最后一个下拉分隔线类

1 个答案: