vue 一个方法同时请求多个接口,怎么控制顺序?在下一个接口获取前一个接口返回的值为空,怎么解决

105 篇文章 0 订阅
85 篇文章 0 订阅

需求:

在点击一个按钮的时候,需要请求接口s1将页面上的城市A转换为对应的城市三字码B,然后再用这个三字码B去请求另外一个接口s2,拿到返回信息C

困境:

在实际项目中我发现,在接口s2中无法拿到接口S1中的B。我们可以在接口s1里面取到B的值,但是在外面无法取到。

分析:

应该是接口请求的顺序问题,运行过程中会优先请求S2,再请求S1,所以,在s2中取B的值时,此时,B还未赋值,所以为空。

 

解决:

控制代码的执行顺序,在S1的成功回调中调用S2

 

代码:

代码有点乱,没有封装,直接回调,将就着看吧,后期再封装

 //通过每个航段的机场名字查询对应的城市名字--出发
        request.post('/orderInfo/selectCityByAirport', {
          airportName: this.alterlMsg.issueList[index].segmentList[index1].dAirportCName,//出发机场名字
          language: "zh_CN",
        }).then(response => {
          var data = response.data;
          if (data.code == 200) {
            this.startAddressd = data.data.cityName+"/"+data.data.cityCode
            this.cityCodef = data.data.cityCode;
          //回调1
            //通过每个航段的机场名字查询对应的城市名字--到达
            request.post('/orderInfo/selectCityByAirport', {
              airportName: this.alterlMsg.issueList[index].segmentList[index1].aAirportCName,//到达机场名字
              language: "zh_CN",
            }).then(response => {
              var data = response.data;
              if (data.code == 200) {
                this.endAddressd =data.data.cityName+"/"+data.data.cityCode
                this.cityCodet = data.data.cityCode
                //单程城市和时间搜索
                //         this.RemoteStr(this.fromCity)
                request.post('/searchFlight/searchAir', {

                  tripType: 1,//单程或往返程类型
                  // fromCity: this.startAddress,//出发城市
                  fromCity: this.cityCodef,//出发城市三子码
                  toCity: this.cityCodet,//到达城市三子码
                  // toCity: this.endAddress,//到达城市
                  fromDate: 20181004,//出发日期
                  adultNumber: 1,//成年人数量
                  childNumber: 0,//小孩数量
                  infantNumber: 0,//婴儿数量
                  language: "zh_CN",
                }).then(response => {
                    var data = response.data;
                    if (data.code == 200) {
                      this.$Modal.info({
                        title: '查询中',
                        type: "success",
                        loading: true,
                        onOk: () => {
                          setTimeout(() => {
                            this.$Modal.remove();
                            this.$Message.success('查询成功');
                          }, 1000);
                        }
                      });
                      this.isBtnhas = true;
                      this.routings = response.data.data.routings;
                      this.redisSelectKey = response.data.data.redisSelectKey;
                    }
                    if (data.code == 50312) {
                      this.$Modal.warning({
                        title: "不好意思",
                        content: "航班无数据"
                      });
                    }
                    if (data.code !== 200 && data.code !== 50312) {
                      this.$Modal.error({
                        title: "查询失败",
                        content: "系统出错啦"
                      });
                    }
                  }
                );
              } else {

              }
            });

          } else {

          }
        });

 

 

  • 3
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 4
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值