async+await解决地狱回调、vue

函数前必须使用async修饰符,代表这个是函数是异步的;

函数内使用await标识等待后面的函数执行完后再执行下一个函数。

首先定义需要排队的请求

rquest1() {
    return new Promise((resolve) => {
        // 执行请求
        resolve(true);
    })
},

request2() {
    return new Promsie((resolve) => {
        // 执行请求
        resolve(true);
    })
},

request3() {
    return new Promsie((resolve) => {
        // 执行请求
        resolve(true);
    })
},

定义异步函数:

async requestAll() {
    let res1 = await request1();
    let res2 = await request2();
    let res3 = await request3();
},

注意点:

1、队列请求函数体内要返回一个Promise对象,可以在里面等待请求回来后执行操作在resolve;

2、函数体内要有一个resolve返回,否则队列不会执行,会停留在第一个;

3、注意箭头函数的使用,否则导致this指向出错;

4、如果不在单个请求函数内做相应数据处理,也可以resolve将数据返回,最后做统一处理

经验分享 程序员 微信小程序 职场和发展