时间:2019-05-03 来源:小程序工厂
J***:
目前并没有提供相关接口,可以尝试监听checkbox-group的change方法,在里面判断已选择的数量来调整每个checkbox的选中状态。
老***:
利用官方例子快速撸了个Demo。楼主可在空白页面看看效果和思路,然后进行精进或扩展。
Page({
data: {
items: [
{ name: 'USA', value: '美国'},
{ name: 'CHN', value: '中国', checked: true },
{ name: 'BRA', value: '巴西'},
{ name: 'JPN', value: '日本'},
{ name: 'ENG', value: '英国'},
{ name: 'TUR', value: '法国'},
],
checkNum: 0,
max: false,
maxCheckedNum: 3
},
onLoad: function() {
var items = this.data.items;
for(var i=0;i
}
},
checkMax: function (num) {
const maxNum = this.data.maxCheckedNum;
const items = this.data.items;
if(num == maxNum){
var status = true;
}else if(num < maxNum && this.data.max){
var status = false;
}
if(status != undefined){
this.data.max = status;
for (var i = 0; i < items.length; i++) {
if (!items[i].checked) items[i].canCheck = status;
}
this.setData({ items: items })
}
},
checkChange: function(e) {
let id = e.currentTarget.id;
this.data.items[id].checked = !this.data.items[id].checked;
this.data.checkNum = this.data.items[id].checked ? this.data.checkNum + 1 : this.data.checkNum - 1;
this.checkMax(this.data.checkNum);
}
})
要注意的是初始选中的数量不能超过最大选择数。
雨***:
感谢伊利丹~~