异步方法是诺言,但返回未定义

时间:2020-09-24 13:59:06

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

我正在使用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

1 个答案:

答案 0 :(得分:3)

我认为您的问题的一部分是您将异步/等待的编写代码风格与诺言链风格混合在一起。当您返回“失败”或“成功”时,通常是从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'
    }
}
相关问题