如何在Vue.js中等待axios响应后再发出响应

Question

如何在Vue.js中等待axios响应后再发出响应

5

我在Vue.js中有一个用于文件上传的小组件（使用axios）。我试图通过以下方式发出文件上传的响应：

methods: {
  ...
  upload (){
    axios.put(URL).then(response => {

    console.log('response', response)
    this.$emit('uploaded', response)

    }).catch(error => {

    })
  }

}

但是在这段代码中，尽管console.log()的响应正常显示，但emit显示为undefined。我认为是在响应准备好之前调用了emit。

有没有办法使用async/await来解决这个问题？

- hidar

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- linasmnew · Accepted Answer

console.log的响应正常显示，但是emit显示未定义。不确定您的意思，因为如果console.log中的响应可用，它也应该在this.$emit中可用。(除非this.$emit本身给出undefined，这种情况下您可能存在作用域问题，但这不应该是该情况，因为您似乎正在使用箭头函数)。

我认为在响应准备好之前就调用了emit。它在回调函数中，所以应该仅在请求完成时调用。

但是，如果您想尝试async / await，请执行以下操作:

async upload() {
  try {
     let response = await axios.put(URL);
     console.log('response', response)
     this.$emit('uploaded', response)
  } catch(error) {
     // error
  }
}