if-statement - 使用 vuejs 中的方法的条件 @click

Question

这是我的 for 循环：

  <li v-for="(crumb, index) in breadcrumbs" :class="{ 'is-active' : index==breadcrumbs.length-1 }">
    <a href="javascript:void(0)" v-if="index==breadcrumbs.length-1">{{ crumb.name }}</a>
  </li>

@click="methodName" 不应该可用于最后一次迭代。

我可以使用 index==breadcrumbs.length-1 检查最后一次迭代是否可以使用 apply v-if？

标签： if-statementvue.js

Answer 1

以这种方式定义事件处理程序有可能：

v-on="condition ? { eventName: () => handler } : {}"

?: 运算符可用作 if...else 语句的快捷方式

在你的情况下，它会是这样的：

<li v-for="(crumb, index) in breadcrumbs" :class="{ 'is-active' : index==breadcrumbs.length-1 }">
    <a href="javascript:void(0)" v-on="index < breadcrumbs.length-1 ? { click: () => methodName(parms) } : {click: ($event) => $event.preventDefault() }" >{{ crumb.name }}</a>
</li>

小提琴