Question

异步函数未捕获（在承诺中）未定义错误

2019-05-02

2395

javascript vue.js

我尝试在创建/更新条目之前进行一些验证，如下所示：

async save(){
      return new Promise((resolve, reject)=>{
        if(!this.isCampaignValid){
          this.handleError()
          reject()
        }
        else{
          this.$store
            .dispatch('updateCampaign')
            .then((res)=>{
              resolve()
              this.showNotification(res.message, 'success')
            })
            .catch(error=>{
              this.showNotification(error.message, 'error')
              reject()
            })
        }
      })
    },

isCampaignValid 是一个计算值，用于计算有效性。

如果活动无效，则控制台中会出现以下错误：

Uncaught (in promise) undefined

this.handleError() 函数也有效。如何处理这种承诺错误情况？

Answer 1

万一出现 handleError() 错误，请尝试：

if (!this.isCampaignValid) {
  try {
    this.handleError()
  } catch (e) {
    console.error(e);
  }
  reject()
}

Answer 2

首先，您不需要在 async 函数中返回承诺。它隐式返回一个承诺，使用函数返回的值进行解析，或者在函数抛出时使用错误对象进行拒绝。虽然您可以返回承诺，并且 JS 会为您解压它，但这是不需要的代码。

也就是说，由于 async 返回承诺，因此您也必须捕获该承诺。由于您的第一个条件块只是抛出错误但没有捕获它，因此 save 返回的承诺将被拒绝。您需要处理该拒绝。

这是您的代码的简化版本，以查看它发生的位置。

async save(){
    if(!this.isCampaignValid){
      this.handleError()
      // Throwing an error in an async function is equivalent to a reject.
      throw new Error('Campaign is not valid') // Here
    }
    else{
      try {
        const res = await this.$store.dispatch('updateCampaign')
        this.showNotification(res.message, 'success')
      } catch (e) {
        this.showNotification(error.message, 'error')
      }
    }
},

// When you call save, catch the error
yourObject.save()
  .then(() => {...})
  .catch(() => {...})

// If your call is in an async function, you can try-catch as well
try {
  await yourObject.save()
} catch(e) {
  // It failed.
}