异步方法是承诺但返回未定义 [重复]答案

【问题标题】：Async method is promise but return undefined [duplicate]异步方法是承诺但返回未定义 [重复]
【发布时间】：2020-09-24 22:12:09
【问题描述】：

我正在开发 Nuxt.js 应用程序并尝试使用 async 方法从 api 获取数据，但 async 方法的结果始终为 undefined。看起来我的方法没有等待响应。我不知道我错过了什么。
这是我在 methods: {..} 中的代码

async getSomething() {
  console.log("getSomething");
  if (condition) {
    axios
      .get("api_url")
      .then((response) => {
        console.log("getSomething success");
        return "success";
      })
      .catch((error) => {
        console.log("getSomething fail 1");
        return "fail";
      });
  } else {
    console.log("getSomething fail 2");
    return "fail";
  }
}
doSomething() {
  console.log("do Something");
  this.getSomething().then((result) => {
    console.log("result", result);
    if (result === "success") {
      // do something on success
    } else {
      // do something on fail
    }
  });
  console.log("end doSomething");
}

我已经尝试记录this.getSomething()，结果是Promise {<pending>}
这里，当一个方法被调用时created () {..}

this.doSomething()
// doSomething
// getSomething
// end doSomething
// getSomething success
// result undefined

【问题讨论】：

标签： javascript vue.js async-await nuxt.js

【解决方案1】：

我认为您的部分问题是您将编写代码的 async/await 风格与 Promise-chaining 风格混合在一起。当您返回“失败”或“成功”时，通常是从 axios.get 回调返回，而不是从 getSomething 方法返回。你可能想像这样重写你的代码：

async getSomething () {
    console.log('getSomething')
    if (condition) {
        try {
            let response = await axios.get('api_url')
            console.log('getSomething success')
            return 'success'
        } 
        catch(error) {
            console.log('getSomething fail 1')
            return 'fail'
        }
    } else {
        console.log('getSomething fail 2')
        return 'fail'
    }
}

【讨论】：