Question

我正在使用VueJS和AdonisJS建立一个网站，并且通过将draft属性设置为true或false来设置发布或取消发布文章的可能性。

可以从索引中看到此属性版本，在该索引中可以看到所有文章。我制作了一个表格，其中有一个可用来切换属性的操作按钮，该按钮会将HTTP POST请求发送到ID为Adonis的

。

我担心的是接下来发生的事情：我不认为替换整个数组是个不错的选择，但是我应该怎么做呢？我尝试了以下方法：

handlePublish (id) {
  this.$axios.post('/post/publish', {id: id}, {
    headers: {
      'Authorization': `Bearer [some token]`
    }})
    .then(response => {
      console.log(response)
      let toDelete = ''
      this.posts.map((post, index) => {
        if (post.id === id) {
          toDelete = index
        }
      })

    this.posts.splice(toDelete, 1)
    this.posts.push(response.data)
 })
 .catch(e => console.log(e.response))
}

但是除了数据库之外，什么都没有得到更新。

提前谢谢

Answer 1

您正在使用map遍历数组。相反，您可以使用map通过返回新元素代替旧元素来获取更新的数组，

.then(response => {
    this.posts = this.posts.map((post, index) => {
        if (post.id === id) {
          return response.data
        }
    })
}

如何使用VueJS在objets数组中用一个对象替换另一个对象？

1 个答案: