Javascript 如何对多个Axios调用运行回退?

Javascript 如何对多个Axios调用运行回退?,javascript,vue.js,vuejs2,axios,Javascript,Vue.js,Vuejs2,Axios,在我的应用程序中,注释可以是父注释,也可以有子注释。删除父注释时,我检查是否存在子注释;如果是这样,我也会删除它们(每个都有一个单独的Axios调用) 但一旦完成所有这些,我需要运行一些刷新代码。有没有一个简单的方法来实现这一点?在哪里可以放置刷新代码 以下是我目前的代码: deleteCommentAxiosCall (id) { return this.$axios.delete(`/api/v1/comment/${this.comment.id}`) }, deleteComment

在我的应用程序中,注释可以是父注释,也可以有子注释。删除父注释时,我检查是否存在子注释;如果是这样,我也会删除它们(每个都有一个单独的
Axios
调用)

但一旦完成所有这些,我需要运行一些刷新代码。有没有一个简单的方法来实现这一点?在哪里可以放置刷新代码

以下是我目前的代码:

deleteCommentAxiosCall (id) {
  return this.$axios.delete(`/api/v1/comment/${this.comment.id}`)
},
deleteComment () {
  return new Promise((resolve, reject) => {
    this.deleteCommentAxiosCall(this.comment.id)
    if (this.comment.child_comments.length) {
      this.comment.child_comments.forEach((child) => {
        this.deleteCommentAxiosCall(child.id)
      })
    }
  })
  window.location.reload() // refresh code

您必须在刷新之前链接承诺,以确保删除得到解决。习惯于一次等待几个承诺。在这种情况下,您将等待删除父注释和子注释

deleteComment () {
  return Promise.all([
    this.deleteCommentAxiosCall(this.comment.id),
    this.comment.child_comments.map(child => this.deleteCommentAxiosCall(child.id))
  ])
  .then(() => window.location.reload())
}
或带有:

另外:重新加载页面可能会让用户感到有些不安。刷新注释的一种更无缝的方法可能是通过显式API请求重新请求注释。例如:

this.$axios.get(`/api/v1/comments`).then(resp => this.comments = resp.data.comments)

再次感谢你的正确答案和第二条建议,这其实很好@drake035没问题:)
this.$axios.get(`/api/v1/comments`).then(resp => this.comments = resp.data.comments)