在vue.js中使用方法的条件@click [英] Conditional @click with a method in vuejs

问题描述

这是我的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"在上一次迭代中不可用.

@click="methodName" shouldn't be available for the last iteration.

我可以使用index == breadcrumbs.length-1检查最后一次迭代 可以使用Apply v-if吗?

I can check the last iteration with index==breadcrumbs.length-1 Is this possible using apply v-if?

推荐答案

可以通过以下方式定义事件处理程序:

There is a possibility by defining the event handler this way:

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

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

The ?: operator can be used as a shortcut for an if...else statement

您的情况是这样的:

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

小提琴

这篇关于在vue.js中使用方法的条件@click的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！