1. 程式人生 > >vue 一個方法同時請求多個介面,怎麼控制順序?在下一個介面獲取前一個介面返回的值為空,怎麼解決

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 {

          }
        });