1
有沒有適當的方法來刷新vueJS數組列表中的一個特定行而不重新加載所有數據?如何更新vueJs數組列表的特定行?
在這種情況下,它是一個電話列表。
<template>
<table class="table">
<tr v-for="phone in phones">
<td @click="edit(phone.id)">
{{phone.number}}
</td>
<td class="pointerCursor" @click="edit(phone.id)">
{{phone.comment | truncate(90)}}
</td>
</tr>
</table>
</template>
<script>
export default {
data() {
return {
phones = [
{id:1, number: '001 656 88 44', comment:''},
{id:2, number: '610-910-3575 x2750', comment:'Quod odit quia'},
{id:3, number: '536.224.2639 x714', comment:'primary phone'},
{id:5, number: '0034 556 65 77', comment:'home phone phone'},
]
}
},
methods: {
edit(id) {
// update using an api that returns the updated data.
var updatedPhone = update(id)
// how to update with reloading all the phone list?
// ...
}
}
}
</script>
PS:這是一個代碼,只是爲了演示問題。
完美的作品。感謝:D – Warrio