欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JS多次請(qǐng)求接口按順序依次執(zhí)行解決辦法

 更新時(shí)間:2024年04月19日 10:28:48   作者:donghua201  
在JavaScript中for循環(huán)是同步的,意味著每個(gè)循環(huán)都會(huì)等待前一個(gè)循環(huán)的請(qǐng)求完成后才會(huì)執(zhí)行下一個(gè)循環(huán),這篇文章主要給大家介紹了關(guān)于JS多次請(qǐng)求接口按順序依次執(zhí)行的解決辦法,需要的朋友可以參考下

需求:在開(kāi)發(fā)中需要同時(shí)請(qǐng)求多個(gè)接口,但是需要請(qǐng)求按順序執(zhí)行。比如先拿到接口a的返回值shopId,作為接口b的請(qǐng)求參數(shù)再調(diào)接口拿到倉(cāng)庫(kù)列表。

解決辦法: 將接口a封裝在Promise中,在調(diào)用Promise前加上await,await會(huì)等待Promise中執(zhí)行完resolve時(shí),才會(huì)再進(jìn)行下一步操作。

// 1、獲取用戶列表,將第一位用戶的門店設(shè)置為當(dāng)前門店
getUsers() {
  return new Promise((resolve, reject) => {
    let data = {
      limit: 999,
      page: 1,
      roleIds: "1,2",
      bindStatus: 0,
    };
    getBuyUserList(data)
      .then((res) => {
        this.userList = res.list;
        if (!this.form.buyId) {
          this.form.buyUserId = res.list[0].userId;
          this.form.shopId = res.list[0].shopId;
        }
        // promise封裝的接口里面可以沒(méi)有return,但是一定要調(diào)用 resolve 函數(shù),表明異步任務(wù)順利完成且返回結(jié)果值
        resolve();
      })
      .catch((error) => {
        reject(error);
      });
  });
},
///2、設(shè)置倉(cāng)庫(kù)的默認(rèn)項(xiàng)
setDefaultSelection() {
  let data = {
    page: 1,
    limit: 10,
    shopId: this.form.shopId,  //只篩選當(dāng)前門店關(guān)聯(lián)的倉(cāng)庫(kù)
  };
  getWarehouseList(data).then((res) => {
    this.warehouseList = res.list;
    if (!this.form.buyId) {
      this.form.warehouseId = this.warehouseList[0].warehouseId;
      this.form.warehouseName = this.warehouseList[0].name;
    }
  });
},
// Vue實(shí)例被創(chuàng)建后立即調(diào)用接口獲取篩選項(xiàng)數(shù)據(jù)
async created() {
    await this.getUsers();
    this.setDefaultSelection();
}

Promise對(duì)象

簡(jiǎn)單說(shuō)就是一個(gè)容器,里面保存著某個(gè)未來(lái)才會(huì)結(jié)束的事件(通常是一個(gè)異步操作)的結(jié)果。

Promise 是一個(gè)對(duì)象,Promise 提供統(tǒng)一的 API,各種異步操作都可以用同樣的方法進(jìn)行處理。axios 的內(nèi)部實(shí)現(xiàn)原理就是通過(guò) Promise 實(shí)現(xiàn)的。

Promise對(duì)象的兩個(gè)特點(diǎn)

  • 對(duì)象的狀態(tài)不受外界影響。有三種狀態(tài):pending(進(jìn)行中)、fulfilled(成功)和rejected(失?。?。只有異步操作的結(jié)果,可以決定當(dāng)前是哪一種狀態(tài),任何其他操作都無(wú)法改變這個(gè)狀態(tài)
  • 一旦狀態(tài)改變,就不會(huì)再變,任何時(shí)候都可以得到這個(gè)結(jié)果。Promise對(duì)象的狀態(tài)改變,只有兩種可能:從pending變?yōu)閞esolved和從pending變?yōu)閞ejected。只要這兩種情況發(fā)生,狀態(tài)就凝固了,不會(huì)再變了,會(huì)一直保持這個(gè)結(jié)果

Promise對(duì)象是一個(gè)構(gòu)造函數(shù),用來(lái)生成Promise實(shí)例,帶有一個(gè)回調(diào)函數(shù),回調(diào)函數(shù)的兩個(gè)參數(shù)是 resolve(成功) 和 reject(失?。?/strong>,這兩個(gè)參數(shù)他們也是函數(shù)。

鏈?zhǔn)秸{(diào)用then方法

then方法的第一個(gè)參數(shù)是resolved狀態(tài)的回調(diào)函數(shù),第二個(gè)參數(shù)是rejected狀態(tài)的回調(diào)函數(shù),它們都是可選的。

但是規(guī)范化的寫法是調(diào)用then和catch方法。

let p = Promise.resolve("foo");
// 等價(jià)于
let p = new Promise((resolve) => {
  resolve("foo");
});

p.then((data) => {
  console.log(data); //輸出'foo'
});


var p2 = new Promise(function (resolve, reject) {
  var flag = false;
  if(flag){
    resolve('這是數(shù)據(jù)2');
  }else{
    reject('這是數(shù)據(jù)2');
  }
});

p2.then(function(data){//狀態(tài)為fulfilled時(shí)執(zhí)行
  console.log(data);
  console.log('這是成功操作');
},function(reason){ //狀態(tài)為rejected時(shí)執(zhí)行
  console.log(reason);
  console.log('這是失敗的操作');
});

總結(jié) 

到此這篇關(guān)于JS多次請(qǐng)求接口按順序依次執(zhí)行解決辦法的文章就介紹到這了,更多相關(guān)JS多次請(qǐng)求接口按順序執(zhí)行內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評(píng)論