這次帶給大家vue checkbox怎樣操作資料綁定及取得與計算，vue checkbox操作資料綁定及取得與計算的注意事項有哪些，下面就是實戰案例，一起來看一下。
# 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;
}
},相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！
推薦閱讀：
#以上是vue+checkbox怎樣操作資料綁定及取得與計算的詳細內容。更多資訊請關注PHP中文網其他相關文章！
