wxml文件
view class="tr" view class="th" checkbox bindtap="selectall" /全选 /view view class="th"id/view view class="th"名称/view/viewcheckbox-group bindchange="checkboxChange" view class="tr" wx:for="{{listData}}" wx:key="" view class="td" checkbox value="{{item.code}}" checked="{{item.checked}}" / /view view class="td" value="{{item.text}}"{{item.code}}/view view class="td" value="{{item.text}}"{{item.text}}/view /view/checkbox-group
wxss文件
.table{background-color: #fff;border:1px solid #dadada;width:1200rpx;margin-left:0rpx;}.tr{background-color: #dadada;white-space: nowrap;width:100%;display: flex;text-align: center;justify-content: center;}.th{background-color: #fff999;text-align: center;justify-content: center;width: 100%;border-bottom: 1px solid #dadada;border-right: 1px solid #dadada;}.td{background-color: #fff;text-align: center;justify-content: center;width: 100%;border-bottom: 1px solid #dadada;border-right: 1px solid #dadada;}
js文件
Page({ data: { select_all: false, listData: [ { code: "1", text: "测试1" }, { code: "2", text: "测试2"}, { code: "3", text: "测试3"} ], batchIds: '', //选中的ids },//全选与反全选selectall: function (e) { console.log(e) var that = this; var arr = []; //存放选中id的数组 for (let i = 0; i that.data.listData.length; i++) { that.data.listData[i].checked = (!that.data.select_all) if (that.data.listData[i].checked == true){ // 全选获取选中的值 arr = arr.concat(that.data.listData[i].code.split(',')); } } console.log(arr) that.setData({ listData: that.data.listData, select_all: (!that.data.select_all), batchIds:arr }) }, // 单选 checkboxChange: function (e) { console.log(e.detail.value) this.setData({ batchIds: e.detail.value //单个选中的值 }) },})
效果图：
