vue+checkbox怎样操作数据绑定及获取与计算

发布网友发布时间：2023-08-08 00:53

共1个回答

热心网友时间：2023-09-18 07:59

这次给大家带来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;
}
},相信看了本文案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！
推荐阅读：
NodeJS怎么实现WebSocket功能

nodeJs连接mysql有哪些方法