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

需求:

在点击一个按钮的时候,需要请求接口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 {

          }
        });

猜你喜欢

转载自blog.csdn.net/weixin_39818813/article/details/82464132