promise/async,await处理多个互相依赖的异步请求

用了自己项目数据字典作为案例,

首先定义好每个请求方法(remote是项目中自己定义的数据字典接口请求方法),每个方法return出下一个请求需要的数据。

      dictA(){
        return remote('log_type').then(response => {
          const code = response.data.code;
          if (code === 0) {
            console.log('aaaaaaaa','log_type')
            return 'social_type'
          }
        });
      },
      dictB(type){
        return remote(type).then(response => {
          const code = response.data.code;
          if (code === 0) {
            console.log('bbbbbbbbbb',type)
            return 'job_type'
          }
        });
      },
      dictC(type){
        return remote(type).then(response => {
          const code = response.data.code;
          if (code === 0) {
            console.log('cccccccccccc',type)
            return '哈哈哈哈哈哈哈哈哈哈'
          }
        });
      },

promise方式处理

      dictAll(){
        this.dictA().then(res =>{
          return this.dictB(res)
        }).then(res => {
          return this.dictC(res)
        }).then(res => {
          this.test = res
          console.log(this.test)
        })
      },

async/await方式处理

      async dictAll(){
        let A = await this.dictA()
        let B = await this.dictB(A)
        this.test = await this.dictC(B)
        console.log(this.test)
      },

两种方式控制台打印如下


image.png

页面渲染成功

<div>{{test}}</div>
image.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容