作業中遇到一個問題
for回圈，再把回圈出來的ID再進行二次請求
這就導致一個問題
請求結果回傳順序不一致
原因：異步請求會把回呼事件放入微任務事件佇列，宏任務執行完畢再執行微任務，具體參考事件佇列機制
解決方法：
通過map方法進行回圈請求
將異步請求方法封裝起來，回傳一個promise
這樣將會回傳一個具有多個promise的陣列
通過promise.all()方法把promise包裝成一個新的promise實體
1 // 通過Promise把所有的異步請求放進事件佇列中 2 getInfo(item ,index) { 3 const ms = 1000 * Math.ceil(Math.random() * 3) 4 return new Promise((resolve,reject) => { 5 setTimeout(() => { 6 axios.get(id).then((result) => { 7 resolve(result) 8 }) 9 }, ms) 10 }) 11 } 12 13 // 回傳多個promise 14 let promise = arr.map((item,index) = > { 15 arr.forEach((item, index) => { 16 return getInfo(item, index) 17 }) 18 }) 19 // 對回傳的promise陣列進行操作 20 Peomise.all(promise).then((allData) => { 21 arr.forEach((item, index) => { 22 // ...... 23 }) 24 })
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/162513.html
標籤：JavaScript