如何使用vue.js实现删除和撤销删除的功能？

Question

如何使用VUE实现删除和撤销删除的功能？

  <div id="one">

     <div>

         <span>1</span>

         <span>这是一条信息</span>

         <span style="color: red">删除</span>

     </div>

     <div>

         <span>2</span>

         <span>这是一条信息</span>

         <span style="color: red">删除</span>

     </div>

 </div>

 <div id="two">

     <div>

         <span>2</span>

         <span>这是一条信息</span>

         <span style="color: green">撤销删除</span>

     </div>

 </div>

 

最后通过点击按钮，获取到已经删除的信息和没有被删除的信息。

Answer 1

删除的时候把 将要删除的值 push 到 某个数组 delList撤销的时候把 上次删除的值 pop 出来function TM(arr){&nbsp; &nbsp; this.arr = arr;&nbsp;&nbsp; &nbsp; this.delArr = [];&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; this.remove = (val) => {&nbsp; &nbsp; &nbsp; &nbsp; this.arr = this.arr.filter(e => e !== val);&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; this.delArr.push(val);&nbsp;&nbsp; &nbsp; }&nbsp; &nbsp; this.back = () => {&nbsp; &nbsp; &nbsp; &nbsp; var val = this.delArr.pop();&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; this.arr.push(val);&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; return val;&nbsp;&nbsp; &nbsp; }}