我有一個在組件之間來回發送和傳遞資料的表單。目前,當用戶更新輸入欄位中的值時,會創建一個新的陣列元素并將其添加到表單結果中。如何只更新陣列元素的屬性而不創建新的陣列元素?
例如,如果您在此表單中編輯以下欄位,它將添加一個全新的陣列元素。我只希望它更新name和iso6393Char3Code屬性:
[
{
"P_uniqueID": 16858,
"name": "Badakhshān",
"iso6393Char3Code": "fas"
},
{
"P_uniqueID": 16859,
"name": "Badakhshān",
"iso6393Char3Code": "pus"
}
]
究竟發生了什么:
[
{
"P_uniqueID": 16858,
"name": "Badakhshānsss",
"iso6393Char3Code": "fas"
},
{
"P_uniqueID": 16859,
"name": "Badakhshān",
"iso6393Char3Code": "pus"
},
{
"P_uniqueID": 16858,
"name": "Badakhshānsss",
"iso6393Char3Code": "fas"
},
{
"P_uniqueID": 16858,
"name": "Badakhshānsss",
"iso6393Char3Code": "fas"
},
{
"P_uniqueID": 16858,
"name": "Badakhshānsss",
"iso6393Char3Code": "fas"
}
]
Codesandbox 在這里:https ://codesandbox.io/s/interesting-haze-f7kl4?file =/ src/components/ISOAdminDivForm.vue
uj5u.com熱心網友回復:
當物件已經在陣列中時,您必須分配物件的值而不是推送到陣列。
language(x) {
// this.formValues.push(x);
let el = this.formValues.find((e) => e.P_uniqueID === x.P_uniqueID);
if (el) {
Object.assign(el, x);
} else {
this.formValues.push(x);
}
this.$emit("languages", this.formValues);
}
作業代碼沙盒
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/349438.html
