[前端异步]循环中所有异步任务完成才往下运行?
reqData(){ this.startLoading(); //获取分析结果数据 for (let i = 1; i { if(PromiseResult.status==="success"){ this.images.push(PromiseResult.image) this.positions.push(PromiseResult.position) } }).catch((error) => { // 处理错误 console.error(error); }); } catch (error) { console.error(`Error fetching data for value ${formattedValue}:`, error); } } console.log("数据请求成功"); this.endLoading(); },
需求:要等for循环中的异步任务所有完成才向下运行
(图片来源网络,侵删)
使用 async/await 来等待所有异步任务完成后再执行后续代码
怎样使用嘞?配合Promise
async reqData() { this.startLoading(); try { // 使用 Promise.all 来等待所有异步任务完成 await Promise.all( Array.from({ length: 24 }, (_, i) => { let formattedValue = (i + 1).toString().padStart(4, '0'); return this.requestData(formattedValue) .then((PromiseResult) => { if (PromiseResult.status === "success") { this.images.push(PromiseResult.image); this.positions.push(PromiseResult.position); } }) .catch((error) => { console.error(`Error fetching data for value ${formattedValue}:`, error); }); }) ); console.log("数据请求成功"); } catch (error) { console.error("Error fetching data:", error); } this.endLoading(); }
在此修改后的代码中,使用了 Promise.all 方法来等待所有的异步任务完成。它接受一个 Promise 数组作为参数,并返回一个新的 Promise,该 Promise 在所有输入的 Promise 都已解析或有一个被拒绝时解析。这样就能够确保所有异步任务都完成后再执行后续的代码逻辑。
(图片来源网络,侵删)
(图片来源网络,侵删)
文章版权声明:除非注明,否则均为主机测评原创文章,转载或复制请以超链接形式并注明出处。
还没有评论,来说两句吧...