vueプロジェクトの中でpromiseはリベート地獄と同時請求の問題を解決します。

シーンの需要:
5つのインターフェースを同時に要求する必要があります。
成功したら次の操作を実行してください。
解決方法：
変数i=5を定義して、i=0の時に次の操作を実行させるまで、コネクタの成功を要求します。
axios.all併発要求，then(axios.spread(function(calback 1，calback 2){}
promise.all同時要求，then(function){}
1、コールバック地獄：
関数はパラメータとして幾重にもネストされています。
代わりに.thenのチェーン操作
2、promise.all同時請求
インターフェースを導入する
import{get Seller Detail}from'.//.appi/seller'
import{getMember CandInfo}from'.//.appi/pay_オンライン/index
データ処理
1.Promiseの例を作成し、データを取得する
2.処理関数reolveとrejectにデータを送る
3.promiseは声明の中で実行しました。

created(){
  if (this.$route.query.type){
    this.type = this.$route.query.type;
    this.sellerId = this.$route.query.targetId;
    this.initApi()
  }
},
methods: {
  initApi(){
    `//     `
    let SellerDetailApi = new Promise((resolve, reject) => {
      getSellerDetail(this.sellerId).then( res => {
        resolve(res)  // resolve(res.data)
      }).catch( err => {
        reject(res)
      })
    })
    `//      `
    let MemberCardInfoApi = new Promise((resolve, reject) => {
      getMemberCardInfo(this.sellerId, this.payMoney).then( res => {
        resolve(res) // resolve(res.data)
      }).catch( err => {
        reject(res)
      })
    })
    `// Promise all  ，       promise       `
    Promise.all([SellerDetailApi, MemberCardInfoApi]).then( res => {
      this.loading = false;
      //     
      this.detail = res[0].data.detail;
      this.sellerPic = this.detail.picture;
      this.sellerName = this.detail.name;
      this.discount = this.detail.discount;
      //      
      this.cardDetail = res[1].data;
      this.balance = this.cardDetail.balance; //  
      this.rechargeTip = this.cardDetail.rechargeTip; //         
    }).catch( err => {
      console.log(err)
    })
  }
}

3、インターフェースの戻り：
promise.allでconsolie.logsが戻ってくるのは、配列インターフェースの戻りです。

4、注意：
Promise.all欠陥のうち、あるミッションに異常が発生したら、すべてのタスクが破棄されます。Promiseは直接reject状態に入り、catchに戻ります。
Promise.allSettledは、タスクが正常であっても異常であっても、対応する状態に戻り、上記の問題を解決することができます。
補足知識：vueプロジェクト中のPromise同期要求
1.jsでPromiseを定義する

export function wxLogin() {
 let pResult = new Promise((resolve, reject) => {
 uni.login({
  provider: 'weixin',
  success: (res) => {
  console.log('login success:', res);
  // return res;
  setTimeout(function() {
   resolve(res);
  }, 3000);
  },
  fail: (err) => {
  console.log('login fail:', err);
  reject(err);
  }
 });
 }).catch(res => {
 console.log(666, res);
 })
 return pResult;
}

2.vueファイルで使用する

 import {login,wxLogin} from '@/common/login.js'
 
  (async () => {
  //      
  console.log(1111,"111")
  let aaa = await wxLogin();
  console.log(3333,"3333");
  console.log(4444,aaa);
  })()

以上のこのvueプロジェクトの中でpromiseがリベート地獄と同時請求の問題を解決するのは小編が皆さんに提供した内容の全部を共有しています。参考にしていただければと思います。どうぞよろしくお願いします。