我有以下內容，它需要一個包含要重復的HTML欄位的插槽：
<div v-for="（row, index）in rows" :key="index">
<div class="d-flex justify-content-between">
<slot name="field">/span>
</slot>/span>
<input v-model="row.value" />/span>
< button @click="removeRow（index）" type="button" class="btn btn-primary waves-effect waves-float waves-light height-10-per" >
移除<i class="fa fa-times-circle"> </i>>
</button>
</div>>
</div>
當我使用removeRow(index)時，它總是洗掉最后一個槽。我已經用<input v-model="row.value">進行了測驗，正確的輸入在這里被移除，但從未移除正確的槽。
我不需要槽中的輸入是動態的或與 Vue 互動，我只想讓用戶通過 Vue 組件動態添加新行/洗掉行。
請看下面兩種我用來添加/洗掉行的方法，以防問題出現在這里：
removeRow(index){
this.rows.splice（index, 1）。
},
addRow（）{
this.rows.push（{value: 'test'})
}
如果有任何幫助，我將非常感激。
uj5u.com熱心網友回復：
在你的v-for回圈元素中添加一個唯一的key值：
<div-for="(row, index) in rows" :key="JSON.stringify(row) ">
這應該確保正確的元素被從DOM中移除。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/327379.html
標籤：
上一篇：Vuejs搜索功能不能正常作業