程序笔记   发布时间:2022-07-12  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了promise/axios async/await使用方法汇总大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。

@H_607_8@方法汇总
  • promise与axios结合使用
    • 1.创建公共请求
    • 2.调用公共请求方法
  • promise请求进行多次回调
    • 1.promise 链式请求
    • 2.使用promise.all
    • 3.使用promise.race
  • 结合async/await进行多次回调

promise与axios结合使用

1.创建公共请求

 promiseFunc: (url) => {
// 返回一个promise对象
    return new Promise((resolve, reject) => {
      axios({
            url: url
            method: 'post',
            data: {
            }
          })
            .then((res) => {
              //此处为请求成功数据
              resolve(res.data);
            })
            .catch(error => {
              //此处为请求失败数据
              reject(error);
            });
    });
  }

2.调用公共请求方法

this.promiseFunc(url).then((res) => {
    //成功
    console.log(res.data);
}).catch(error => {
    //失败
    console.log(error);
});

promise请求进行多次回调

1.promise 链式请求

//promise then方法返回的是一个全新的promise对象
promiseFunc: () => {
    new Promise((resolve, reject) => {
      setTimeout(() => {
         resolve()
      },1000)
   })
}
promiseFunc().then(promiseFunc())
             .then(promiseFunc())
             .then(promiseFunc())
             .then(promiseFunc());

2.使用promise.all

注意:只要有一个接口失败了࿰c;则会先返回失败的数据。只有所有接口都成功时才会返回一个数组

let p1 = new Promise((resolve,reject) => {
   resolve()
})
let p2 = new Promise((resolve,reject) => {
   resolve()
})
let p3 = new Promise((resolve,reject) => {
    resolve()
 }) 
Promise.all([p1, p2, p3]).then(res => {
    console.log(res)  
}).catch(err => {
    console.log(err)
})

3.使用promise.race

注意:会返回最先获取成功的数据࿰c;拿个快就先返回哪个࿰c;无论成功还是失败

let p1 = new Promise((resolve,reject) => {
   resolve()
})
let p2 = new Promise((resolve,reject) => {
   resolve()
})
let p3 = new Promise((resolve,reject) => {
    resolve()
 }) 
Promise.race([p1, p2, p3]).then(res => {
    console.log(res)  
}).catch(err => {
    console.log(err)
})

结合async/await进行多次回调

当一个方法前面加了async࿰c;那么它就变成了一个异步方法 await会阻塞进程࿰c;等上一个执行完毕࿰c;再执行下一个

async function a1() {
   return res;
}
async function a2() {
   return res;
}
let a1 = await a1();
let a2 = await a2();
console.log(a1, a2)

大佬总结

以上是大佬教程为你收集整理的promise/axios async/await使用方法汇总全部内容,希望文章能够帮你解决promise/axios async/await使用方法汇总所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。