Vue.js Vue:如果数据库写入失败，则撤消从v-for数组中删除项

我有一个

v-for

消息循环。当用户单击delete按钮时，我想快速将其从UI中删除，并从数据库中删除消息。如果由于某种原因数据库写入失败，我如何才能像从未发生过一样“撤消”删除？我正在考虑将

拼接

设置为一个变量，但是我怎么才能再次回到那个位置呢

<div v-for="(item,index) in items" :key="item.id">
   <button @click="deleteItem(item,index)">Delete Item</div>
</div>

  deleteItem(item,index) {
      this.items.splice(index, 1);

      axios.delete('http://localhost:5000/api/posts/' + item._id)
      .then(resp => {
          if (resp.status != 200) {
              //UNDO splice of items
          }
      })
  },

删除项目
删除项（项，索引）{
本标准中的项目拼接（索引1）；
axios.delete（'http://localhost:5000/api/posts/“+项._id）
。然后（resp=>{
如果（各自状态！=200）{
//撤消项目的拼接
}
})
},

您可以获取将被删除的元素，然后在数据库中删除失败时将其插入

deleteItem(item,index) {
  let el = this.items.slice(index, index+1)[0];
  this.items.splice(index, 1);

  axios.delete('http://localhost:5000/api/posts/' + item._id)
  .then(resp => {
      if (resp.status != 200) {
          //UNDO splice of items
        this.items.splice(index, 0, el);
      }
  })
},

---

谢谢林！我忘了拼接也可以用来插入。是的，拼接是用来改变阵列的