wxml

block wx:for="{{list}}" wx:key="{{item.id}}" wx:for-index="idx"  view class='cont'    checkbox-group bindchange="checkboxChange" data-checkid = "{{item.id}}"      label        checkbox checked="{{item.checkeditem}}"  color='#3B9EF5'/      /label    /checkbox-group    view class='column'      text{{item.shopName}} {{item.price}}/text      text{{item.guige}}/text      text{{item.desc}}/text    /view    view class='count'      text-/text      text{{shopNum}}/text      text+/text    /view  /view/blockview class='all'  checkbox-group bindchange="checkedAll"    label      checkbox checked="{{checked_all}}"  color='#3B9EF5'/    /label    全选  /checkbox-group/view

wxss

page{  background: #f1f1f1;}.cont{  background: #ffffff;  margin-top: 20rpx;  padding: 20rpx;  display: flex;  align-items: center;}.column{  display: flex;  flex-direction: column;  margin-left: 50rpx;}checkbox .wx-checkbox-input{  border-radius: 50%;}.all{  margin-top: 20rpx;  background: #ffffff;}

js

Page({  /**   * 页面的初始数据   */  data: {    list: [      {        id: 15,        shopName: '小神童',        guige: '75gx40支',        desc: '建议零售0.5元/支',        price:10      },      {        id: 16,        shopName: '蒙牛',        guige: '75gx40支',        desc: '建议零售0.5元/支',        price:20      },      {        id: 17,        shopName: '伊利',        guige: '75gx40支',        desc: '建议零售0.5元/支',        price:30      }    ],    countSum:0,    checked_all:false,    shopNum:0,    trolleyArr:[]  //购物车商品id  },  //单选  checkboxChange: function (e) {    // console.log(e)    var that = this    var value = e.detail.value;    var valLen = value.length    var checkid = e.target.dataset.checkid    var list = that.data.list    var listLen = list.length    var num = 0    if(valLen != 0){      //选中      for(var i=0;ilistLen;i++){        if (list[i].id == checkid) {//console.log(list[i].id + 'if' +checkid)          if (!list[i].checkeditem){            list[i].checkeditem = true;            num = num + 1;           //console.log('--' + num)            that.data.trolleyArr.push(list[i].id);          }        }else{          if (list[i].checkeditem) {//console.log(list[i].id + 'else' + checkid)            num = num + 1;           //console.log('++' + num)          }        }      }      // console.log(that.data.trolleyArr)      if(num == listLen){        that.setData({          checked_all:true  //全选        })      }    }else{      var arr = []      var trolleyLen = that.data.trolleyArr.length      for(var i=0;ilistLen;i++){        if(list[i].id == checkid){          if(list[i].checkeditem){            list[i].checkeditem = false            for(var j=0;jtrolleyLen;j++){              if(that.data.trolleyArr[j] == checkid){                continue;              }else{                arr.push(that.data.trolleyArr[j])              }            }          }        }      }      that.setData({        trolleyArr:arr,        checked_all:false      })    }      that.setData({        list:list      })    // console.log(that.data.trolleyArr)  },  // 全选  checkedAll:function(e){    var that = this    var value = e.detail.value;    var valLen = value.length    var list = that.data.list    var listLen = list.length    // console.log(valLen)    if (valLen != 0){      for(var i=0;ilistLen;i++){        list[i].checkeditem = true;        that.data.trolleyArr.push(list[i].id)      }      that.setData({        checked_all:true,//全选        list:list      })    }else{      for(var i=0;ilistLen;i++){        list[i].checkeditem = false      }      that.setData({        trolleyArr:[],        checked_all:false,        list:list      })    }   }}