html
<input type='checkbox' v-model='checkboxModel' :value='z.coach_id+"-"+z.amount' :i="dianji" @click="lll">
第一个CheckBox
<span><input type='checkbox' v-model='checked' v-on:click='checkedAll'><span class="select-all">全选</span></span>
第二个
定义
return {
dianji:'12',
list: [],
value:{},
value1:{},
checkAll: false,
checkArr:[],
checkboxModel:[],
wodeshi:'0',
checked:false
}
lll: function(){
var self = this;
var sum=0;
setTimeout(function(){
for(var x in self.checkboxModel){
sum += parseInt(self.checkboxModel[x].split('-')[1])
}
self.wodeshi=sum;
},0)
// console.log(self.checkboxModel)
},
checkedAll: function() {
var _this = this;
if (this.checked) {//实现反选
_this.checkboxModel = [];
}else{//实现全选
_this.checkboxModel = [];
_this.list.forEach(function(z) {
_this.checkboxModel.push(z.coach_id+'-'+z.amount);
});
}
if(_this.checkboxModel.length==0){
this.wodeshi=0;
// console.log(_this.checkboxModel);
}else {
var self =this;
var sum =0;
for(var x in self.checkboxModel){
sum += parseInt(self.checkboxModel[x].split('-')[1])
}
self.wodeshi=sum;
}
},
以上这篇vue checkbox 全选 数据的绑定及获取和计算方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持。