<view class="view-checkbox-box" v-if="isShow">
<view class="view-checkbox-item" v-for="(item, index) in classData" :key="index">
<checkbox-group @change="classlist(index)"> ←————重点
<label class="radio">
<checkbox :value="item.class_id" color="#FF6604" style="transform:scale(0.7)" :checked="item.isCheckeds" />{{item.name}}</label>←————重点
</checkbox-group>
</view>
</view>
重点:@change="classlist(index)"
:checked="item.isCheckeds"
permissionClasses: function() {
var that = this;
var para = {
start: 0
}
this.tui.request(this.interfacePath.permissionClasses, para, true).then((res) => {
for (var i = 0; i < res.data.length; i++) {
res.data[i].isCheckeds = false; ←————重点
}
that.classData = res.data;
this.resourceEditPermissionDetail();
})
},
对比回填值
resourceEditPermissionDetail: function() {
var that = this;
this.tui.request(that.interfacePath.resourceEditPermissionDetail, {}, false, '/' + that.id).then((res) => {
for (var i = 0; i < that.classData.length; i++) {
for(var j=0;j<res.data.permission.classes.length;j++){
if(that.classData[i]['class_id'] == res.data.permission.classes[j]){←————重点
that.classData[i]['isCheckeds'] = true;←————重点
}
}
}
})
},
监听复选框
classlist: function(index) {
var invoice = this.classData[index]; //变量 invoice == 数组每一项索引
if (invoice) {
invoice.isCheckeds = !invoice.isCheckeds //取反
}
},
提交
confirmBtn: function() {
var that = this;
this.class_ids = []
that.classData.forEach(item => {
if (item.isCheckeds == true) {
that.class_ids.push(item.class_id); ←————重点 获取选中的值放到数组中
}
});
var para = {
share: this.share,
permission: this.permission
}
if (this.permission == '2') {
para.class_ids = this.class_ids
}
console.log(para);
}
参考文档:https://blog.csdn.net/weixin_43457011/article/details/112655880