javascript - Bagaimana untuk menggunakan vue.js untuk melaksanakan fungsi pemadaman dan nyahpadam?

Question

Bagaimana untuk menggunakan VUE untuk melaksanakan fungsi pemadaman dan nyahpadam?

  <p id="one">
     <p>
         <span>1</span>
         <span>这是一条信息</span>
         <span style="color: red">删除</span>

     </p>
     <p>
         <span>2</span>
         <span>这是一条信息</span>
         <span style="color: red">删除</span>

     </p>
 </p>
 <p id="two">
     <p>
         <span>2</span>
         <span>这是一条信息</span>
         <span style="color: green">撤销删除</span>

     </p>
 </p>
 

Akhir sekali, dengan mengklik butang, anda boleh mendapatkan maklumat yang dipadam dan maklumat yang belum dipadamkan.

Answer 1

Apabila menjana maklumat, tambah ID dan gunakan ID untuk mendapatkan maklumat yang sepadan

Answer 2

Apabila memadam, tolak nilai yang hendak dipadamkan ke array delList

Apabila membuat asal, keluarkan nilai terakhir yang dipadamkan

function TM(arr){
    this.arr = arr; 
    this.delArr = [];     

    this.remove = (val) => {
        this.arr = this.arr.filter(e => e !== val); 
        this.delArr.push(val); 
    }

    this.back = () => {
        var val = this.delArr.pop(); 
        this.arr.push(val); 
        return val; 
    }
}