【多个请求按顺序执行】通过async await和promise按顺序执行请求,多种方法情况集合

情况1:循环多个请求,但是有请求嵌套,A请求要先发送,然后拿到A的数据发给B请求,然后拿到B的数据。这才算是循环一次完成

比如循环三次,顺序应该是 A,B,A,B,A,B
这里是通过async await和promise配合完成
把请求用promise抱起来,请求成功再返回resolve。
然后用await阻断,按顺序执行。

async function save(){
    for (let i = 0; i < state.tableDataSplitOrderAll.length; i++) {  
        let item=state.tableDataSplitOrderAll[i]
        let oid=[]
        if(item.data.length>0){
            item.data.forEach(i=>{
                oid.push(i.order_item_id)
            })
            await nestedRequest(oid);  //这里通过await每次循环的时候等待返回值再进行下一轮循环,注意用for循环
        }
    } 
    return
    state.splitOrderShow = false
}
// 多个请求嵌套,通过await先执行第一个请求,然后拿到resolve的参数给到B请求继续执行,全部执行完毕后,上面循环的会进入下一次循环
async function nestedRequest(ids){
    let info= await a(ids)
    await b(ids,info)
}
// 请求里面用promise套一层,因为需要等你请求成功了拿到返回值才能算是成功执行,所以是请求成功再resolve
function a(ids){
    return  new Promise(resolve =>{
        setTimeout(()=>{
            console.log(ids,'ids')
            resolve('内容888')
        },1000)
    })
}
function b(ids,info){
    console.log(ids,info,'name')
}

情况2:多个请求按顺序执行,比如循环发送请求时

可以通过promise.all来实现
实现逻辑:先定义一个空数组,然后循环把请求加到数组内,
然后promise.all(数组)就自动按顺序执行了,
需要获取数据的时候就promise.all(数组).then()就可以拿到返回值,
返回值是一个数组,是多个请求的返回值,
你按什么顺序发送的,就会按什么顺序返回值

let promises = [];
                        for (let index = 0; index < list.length; index++) {
                            const element = list[index];
                            let promise = http.post('zkjk_doctor_assistant', {
                                hospital_id: userinfo.hospital_id,
                                part_id: that.link.part_id,
                                kf: element.name,
                                kf_id: element.id,
                                ks_ids: that.ruleForms.ks,
                                child_ks_ids: that.ruleForms.child_ks,
                                group_id: that.ruleForms.xz_value,
                                group_leader: 0,
                                file_url: '',
                            }, {
                                headers: {
                                    hosId: userinfo.hospital_id,
                                }
                            });
                            promises.push(promise);
                        }

                        Promise.all(promises)
                            .then(responses => {
                                let success = true;
                                responses.forEach(response => {
                                    if (response.data.code != 200) {
                                        success = false;
                                        this.$message({
                                            showClose: true,
                                            message: response.data.msg,
                                            type: 'error'
                                        });
                                    }
                                });
                                if (success) {
                                    that.dialogVisibles = false;
                                    this.$message({
                                        showClose: true,
                                        type: 'success',
                                        message: '保存成功!'
                                    });
                                    that.search();
                                }
                            })
                            .catch(error => {
                                // 处理错误
                            });
  • 10
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
`Promise` 和 `async/await` 的执行顺序都基于 JavaScript 事件循环机制。 在 `Promise` 中,异步操作会被添加到事件队列中,然后按照队列中的顺序执行。在执行过程中,如果遇到了异步操作,就会将其添加到事件队列中等待执行。当所有的同步任务执行完毕后,才会开始执行异步任务。 在 `async/await` 中,异步操作会被转化成一个 `Promise` 对象,并使用 `await` 等待异步操作的结果。在执行过程中,如果遇到了 `await`,JavaScript 引擎会暂停当前的异步操作,并等待 `Promise` 对象的状态变为 `resolved` 或 `rejected`,然后再继续执行后面的代码。 下面是一个简单的例子,演示了 `Promise` 和 `async/await` 的执行顺序: ``` // 使用 Promise console.log('start'); new Promise((resolve, reject) => { console.log('Promise1'); resolve(); }) .then(() => { console.log('Promise2'); }); console.log('end'); // 使用 async/await async function asyncFunc() { console.log('start'); await new Promise((resolve, reject) => { console.log('Promise1'); resolve(); }); console.log('Promise2'); console.log('end'); } asyncFunc(); ``` 在 `Promise` 中,首先输出了一个 `start`,然后创建了一个 `Promise` 对象并添加到事件队列中,接着输出了一个 `end`,最后在异步任务执行完毕后输出了 `Promise2`。 在 `async/await` 中,首先输出了一个 `start`,然后创建了一个 `Promise` 对象并使用 `await` 等待其执行结果,接着输出了一个 `Promise2` 和一个 `end`。 因此,最终的输出结果分别是: ``` // Promise start Promise1 end Promise2 // async/await start Promise1 Promise2 end ```

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

接口写好了吗

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值