javascript - 如何检查所有表 Vue.js

Question

我想用 vue+axios 创建 web crud。但我不明白如何创建复选框检查所有使用 vue 使用数据 api，稍后删除所有，我使用此方法但数据没有出现对不起我刚刚学习 vue + axios https://pastebin.com/iJDPU0AB

<table id="" class="table table-bordered table-striped">
    <thead>
        <tr>
            <th><input type="checkbox" v-model="selectAll"></th>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
        </tr>
     </thead>
     <tbody id="target_listing">
        <tr v-for="tl in target_listing">
              <td><input type="checkbox" v-model="selected" :value="user.id" number></td>
              <td>{{ tl.id_target_mst_status }}</td>
              <td>{{ tl.category }}</td>
              <td>{{ tl.first_name }}</td>
              <td>{{ tl.last_name }}</td>
              <td>{{ tl.revisit }}</td>
              <td>{{ tl.visit_status }}</td>
         </tr>
      </tbody>
 </table>

我的 app.js

var myTable = new Vue({
el: '#target_listing',
data(){
    return{
        target_listing:null
    }
    selected: []
},
mounted(){
    axios
        .get('http://localhost/warna2/public/api/target_listing')
        .then(response => (this.target_listing = response.data.data))
        .catch(error => {
            console.log(error)
            this.errored = true
        })
},
computed: {
    selectAll: {
        get: function () {
            return this.target_listing ? this.selected.length == this.target_listing.length : false;
        },
        set: function (value) {
            var selected = [];
            if (value) {
                this.target_listing.forEach(function (user) {
                    selected.push(user.id);
                });
            }
            this.selected = selected;
        }
     }
  }
})

标签： javascriptvuejs2axios