我知道外面已經有很多類似的問題，但似乎都沒有解決這個具體問題。我有一個Javascript函式，其中包含一個forEach回圈，在forEach回圈中，有異步呼叫。
代碼大致是這樣的：
const handleConvert=（/span>）=> {
const refs = { ...imageRefs.current }
//外回圈
Object.keys(refs).forEach(>key => {
// Inner loop
refs[key].forEach(ref => {
toPng(ref)
.then((dataUrl) => {
props.setImageUrls(span class="hljs-params">old) => {
return {
...old。
[key]: [...old[key], dataUrl] 。
}
})
})
.catch(err => {
console.error(err)
})
})
})
setConverting(false)
setConverted(true)
}
refs是一個包含2個鍵的物件，每個鍵都有一個陣列作為它的值。它看起來像這樣：
{
a: [1, 2, 3]。
b: [3, 4, 5]
}
toPng()函式回傳一個承諾。我試圖在執行外層forEach回圈之后的代碼之前，等待所有這些承諾的解決：
if ( mounted) {
setConverting(false)
setConverted(true)
}
是否有辦法在執行外回圈之后的代碼之前等待所有承諾的解決？也許可以用Promise.all()?
uj5u.com熱心網友回復：
嵌套另一個Promise.all來等待每個子陣列完成。確保映射并回傳每個Promise給呼叫者，這樣Promise.all就能正常作業。
Promise.all(
Object.entries(refs)
.map(([key, arr]) => Promise.all(
arr.map(span class="hljs-params">num =>)
toPng(num).then(dataUrl => {
props.setImageUrls(old => ({ ...old, [key]: [...old[key], dataUrl] })
})
)
))
)
.then( // all done。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/318035.html
標籤：