如何通過在Vue公司JS

Question

此代碼模板變量事件處理方法：

<tbody v-for="contact in contacts"> 
    <tr v-on:click="selectContact(1)"> 

在Vue公司的js運作良好。

但這：

<tbody v-for="contact in contacts"> 
    <tr v-on:click="selectContact({{contact.index}})"> 

似乎並沒有很好地工作。導致一個錯誤。那麼如何將contact.index這樣的環境變量傳遞給事件方法呢？

Answer 1

<tbody v-for="contact in contacts"> 
    <tr v-on:click="selectContact(contact.index)"> 

或簡單地

<tbody v-for="contact in contacts"> 
    <tr @click="selectContact(contact.index)"> 

v-on指令將評估串作爲表達。您不必插入額外的{{ }}。

Answer 2

添加到獅子座的回答，如果你正在尋找讓V-for循環的指數比你必須做以下幾點：

<tbody v-for="(contact, index) in contacts"> 
    <tr v-on:click="selectContact(index)"> 

Answer 3

二代碼導致錯誤有關插值

<tbody v-for="contact in contacts"> 
    <tr v-on:click="selectContact({{contact.index}})"> 

爲什麼會發生這種情況？因爲你使用的模板部分{{}}變成v-on:click指令，哪個VueJS看起來就像普通的又名香草JS，所以它不能接受這裏的模板{{}} - 鬍鬚。

以前的答案爲您提供正確和有效的解決方案。