Я хочу создать Web Crud с Vue + Axios.но я не понимаю, как создать checbox проверить все использовать 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>
my 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;
}
}
}
})