我有一個 id 陣列，存盤在 中ids，我正在映射到異步函式asyncFunc. 我想將映射結果存盤到newArr然后通過setState. 這是我的代碼：
useEffect(() => {
const newArr = [];
ids.map((element) => {
asyncFunc(variables).then((data) => {
newArr.push({ layer: makeLayer(data) });
});
});
setState([...layers, ...newArr]);
}, [variables]);
我的問題是在映射完成之前狀態正在更新。僅當回傳所有映射的資料時，如何使用更新狀態？.then()包裝沒有ids.map用。Promise.all此外，以下回傳錯誤：
useEffect(() => {
const newArr = [];
(ids.map((element) => {
asyncFunc(variables).then((data) => {
newArr.push({ layer: makeLayer(data) });
});
})).then(()=> {
setState([...layers, ...newArr]);
})
}, [variables]);
uj5u.com熱心網友回復：
宣告一個異步函式來填充陣列并在Promise.all. 這樣的事情應該適用于你想要完成的事情：
useEffect(() => {
const populateArray = async () => {
const newArr = await Promise.all(ids.map(async element => {
const data = await asyncFunc(variables)
return { layer: makeLayer(data) }
})
setState([...layers, ...newArr]);
}
populateArray()
}, [variables]);
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/461565.html
標籤：javascript 反应 反应式 异步 异步等待