javascript - 如何在没有 async/await 的情况下使用 then、catch 来实现这个 promise 链

Question

1. 我应该从服务器获取一些信息。
2. 如果信息无效，我应该使用另一个服务器查询来获取信息。
3. 如果信息再次无效，我应该返回拒绝的 promise (错误)
4. 如果信息在 2 或 3 个步骤中有效，我应该保存它并向调用代码返回已解决的 promise

我通过使用 async/await 来完成此操作。但我不明白如何使用 then 和 catch block 来做到这一点。

我的代码:

this.loadSettingReport()
  .then(() => {
    console.log("Success!")
  })
  .catch((error) => {
    console.log("Promise worked with Error")
    console.log(error)
  })

//...

async loadSettingReport() {
  console.log("SettingReport - Company")
  let response = await findAllSettingsReports(this.$axios, /*someParameters*/) //request via axios - return promise
  let data = response.data
  console.log(data)
  if(data.length === 0) {
    console.log("SettingReport - Common")
    response = await findAllSettingsReports(this.$axios, /*other someParameters*/) //request via axios  - return promise
    data = response.data
    if (data.length === 0) {
      console.log("SettingReport - NotFound")
      throw new Error("SettingReport - NotFound")
    }
  }
  //Do something...
},

//...

export const findAllSettingsReports = function($axios, params = {}){
  return $axios.get(url, isEmpty(params) ? {} : { params: params })
}

更新:我的最终变体是:

loadSettingReport() {
   return findAllSettingsReports(this.$axios, {variant: "ID", rows: true, search: "common:false,company.id:"+this.company.id + ",typeReport.id:" + this.typeReportId})
      .then(response => {
         if(response.data.length == 0) {
            return findAllSettingsReports(this.$axios, {variant: "ID",  rows: true, search: "common:true,typeReport.id:" + this.typeReportId})
         }
         return response
      })
      .then(response => {
         if(response.data.length == 0) {
            throw new Error("Настройка отчетов не найдена")
         }
         this.setting = response.data[0]
         return response.data[0]
      })
}

Answer 1

一般规则是更改所有

someVar = await somePromise;
// more lines

进入

return somePromise.then((someVar) => {
  // more lines
});

您正在尝试做两件不同的事情，看起来像:

• 检索数据(重试一次)

• 利用数据做一些事情

为了减少重复，并让它们与 .then 语法很好地配合，请将它们放入单独的函数中:

loadSettingReport(retries = 1) {
  return findAllSettingsReports(this.$axios, /*someParameters*/).then((response) => {
    if(response.data.length === 0) {
      if (retries === 0) {
        throw new Error("SettingReport - NotFound");
      }
      return this.loadSettingReport(retries - 1);
    }
    return response;
  });
},
processSettingsReport(response) {
  // do something
}

和

this.loadSettingReport()
  .then(response => this.processSettingsReport(response))
  .catch((error) => {
    console.log("Promise worked with Error")
    console.log(error)
  })