這個問題在這里已經有了答案： 使用擴展運算子時如何更新陣列內的元素 [重復] 1 個答案 13 小時前關閉。
我試圖用這樣的擴展語法替換陣列中物件的屬性：
const origArray = [
{
"uuid":"c752cf08-d142-42f8-b9df-b1e6c4e1fba6",
"name":"Team 1",
"players":[
"41ed7b28-5a52-48a3-8587-1355b40fc81f"
]
},
{
"uuid":"d46829db-f2c6-44a3-bd59-e18e2740c069",
"name":"Team 2",
"players":[
]
}
]
const doesNotWork = (prev) => [...prev, {...prev[match], name: e.target.value}]
const result1 = doesNotWork(origArray)
console.log(result1)
// # I know this works:
const doesWork = (prev) => {
let old = [...prev]
old.splice(match, 1, {...prev[match], name: e.target.value});
return old;
})
const result2 = doesNotWork(origArray)
console.log(result2)我希望 reslut1 像 result2，但我似乎錯了。如果可能的話，我想用單行函式而不是我的解決方法來寫這個。
如您所見，我找到了一種解決方法，但只是為了確保我完全理解問題，它并沒有替換該物件，因為它假設它是一個不同的物件，對吧？
uj5u.com熱心網友回復：
我可以通過過濾器、地圖和物件來建議這些方式。
但是過濾方式改變了陣列中元素的順序
const origArray = [
{"uuid":"c752cf08","name":"Team 1",},
{"uuid":"d46829db","name":"Team 2",},
{"uuid":"d46829d0","name":"Team 3",}];
const match = 1;
const name = 'Team 100';
//------------------------
const workWithFilter = (prev) =>
[...prev.filter((_, i) => i !== match), { ...prev[match], name }];
const result1 = workWithFilter(origArray);
console.log('workWithFilter:', result1);
//------------------------
const workWithMap = (prev) =>
prev.map((v, i) => (i === match) ? { ...v, name } : v);
const result3 = workWithMap(origArray);
console.log('workWithMap:', result3);
//------------------------
const workWithObject = (prev) =>
Object.assign([...prev], { [match]: { ...prev[match], name } });
const result4 = workWithObject(origArray);
console.log('workWithObject:', result4);
//------------------------
const doesWork = (prev) => {
let old = [...prev]
old.splice(match, 1, { ...prev[match], name });
return old;
}
const result2 = doesWork(origArray);
console.log('doesWork:', result2);.as-console-wrapper {max-height: 100% !important; top: 0}轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/412319.html
標籤：