我有一個問題是，當我從 API 回傳一些資料，將其添加到狀態陣列時，我只得到最后一個串列項，即使它映射超過 1 個專案。
const [items, setItems] = useState([]);
const fetchData = ()=> {
DataService.getEnergyDataList()
.then(response => {
response.data.map(res=>{
setItems([...items, res.Voltage])
});
}
)
.catch(e => {
console.log(e);
});
}
uj5u.com熱心網友回復：
問題是您setItems重復呼叫（在map回呼中），重復使用原始專案，然后再提供一個。這設定了一堆狀態更新，只保留最后一個。
相反，使用map創建的陣列：1
const fetchData = () => {
DataService.getEnergyDataList()
.then(response => {
setItems([...items, ...response.data.map(res => res.Voltage)]);
})
.catch(e => {
console.log(e);
});
};
1每當您map發現自己在不使用創建的陣列的情況下進行撰寫時map，這是不正確的。（更多關于我的博客。）確定您是否需要該陣列，然后修改代碼以使用陣列map回傳，或者將其更改map為其他一些回圈機制。
uj5u.com熱心網友回復：
.map問題是您正在為回呼中的每個元素設定專案。如果要將新的回應附加到專案，可以使用 setState 的回呼方法，例如：
.then(response =>
setItems(currentItems => [...currentItems, ...response.data.map(res=> res.votage))
);
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/413797.html
標籤：
上一篇：更改具有公共鍵的物件陣列中的鍵