如何将参数传递给Vue @click事件处理程序

用户名 · 03月10日

我正在使用Vue.js创建一个表,我想onClick为每条通过的行定义一个事件contactID这是代码:

<tr v-for="item in items" class="static" 
    v-bind:class="{'evenRow': item.oddeven=='1', 'oddRow': item.oddeven=='0' }"
@click="addToCount('{item.contactID}')"
>
    <td>{{item.contactName}}</td>
    <td>{{item.recipient}}</td>
</tr>   

在单击一行时,它正在调用addToCount(),这是有效的。我想传递item.contactIDaddToCount()有人可以为此建议正确的语法吗?

回答(2)
时间
莱纳斯·伯格
2 · 2020-03-10 14:10:33

只需使用正常的Javascript表达式即可,无需使用{}或执行任何必要操作:

@click="addToCount(item.contactID)"

如果您还需要事件对象:

@click="addToCount(item.contactID, $event)"
亚历山大·金布赖恩·格拉兹
1 · 2020-03-10 14:10:33

使用Vue指令时,表达式是在Vue的上下文中求值的,因此您无需将内容包装在中{}

@click只是v-on:click指令的简写,因此适用相同的规则。

就您而言,只需使用 @click="addToCount(item.contactID)"

你的回答

加载中...
⌘+Return 发表
发表

温馨提示:登录后可发表评论或回复

关闭,朕知道了

扫码关注微信公众号或小程序