我有一个带有Buefy扩展的Vue2项目。然后,我有一个对象数组,它在模板中呈现,每个项都有一个select组件。一切正常,但是如果我在其中一个select元素上触发@input事件,它就会触发列表中所有选择的输入事件。我不明白这是怎么回事。
<div v-for="(inv, index) in pendingInvitations" :key="index" class="columns is-desktop">
<div class="column is-4">{{inv.email}}</div>
<div class="column is-4">
<b-field class="mb-5">
<b-select v-if="invitationRoles"
:input="changeInvitationRole(index)"
v-model="pendingInvitations[index].role"
:placeholder="role">
<option v-for="(value, key) in invitationRoles"
:key="key"
:value="value">
{{ value }}
</option>
</b-select>
</b-field>
</div>
</div>
...
changeInvitationRole(index){
console.log(index);
},如果更改角色,并且列表中有三个项,则console.log()会将0、1、2写入所有项的索引。为什么会发生在我身上?我希望日志中只包含当前的itmes索引。
发布于 2021-11-18 12:38:40
尝试将输入替换为change
https://stackoverflow.com/questions/70019723
复制相似问题