微信小程序 checked 选择功能 js中获取对应的选择值的改变以及修改

要在js中获取checkbox选择值 必须在外面包裹一个checkbox-group

 

wxml 代码

  <scroll-view class="s_view" scroll-y="true">
        <block wx:for="{{list}}" wx:key="{{this}}">
            <view class="m_item" wx:key="{{index}}">
                <view class="m_left">
                    <checkbox-group bindchange="checkboxChange" data-index="{{index}}">
                        <label class="change_check">
                            <checkbox class="child" value="{{item.name}}" checked="{{item.checked}}"></checkbox>
                        </label>
                    </checkbox-group>
                    <image class="m_img" src="{{'../../../../'+item.img}}"></image>
                    <view class="m_text">
                        <text class="m_name">{{item.name}}</text>
                        <text class="m_num">{{item.num}}</text>
                        <text class="m_btn"></text>
                    </view>
                </view>
                <view class="m_icon">
                    <text class="m_del"></text>
                    <text class="m_edit"></text>
                </view>
            </view>
        </block>
    </scroll-view>

index.js中代码

 checkboxChange(e) {
    var arr = [...this.data.list];
    var postIndex=e.currentTarget.dataset.index;
    var len=e.detail.value.length;
    //选中
      arr.forEach((item,index)=>{
        if(index===postIndex){
          item.checked=(len!=0);
        }
      })
      //更新数据
      this.setData({
        list:arr
      },()=>{
        //处理选中的数组获取其长度
        var result=this.dealArr(this.data.list).length;
        //更新数据
        this.setData({
          arrLength:result
        })
      })
  },
  //过滤选中的数组
  dealArr(arr){
    return arr.filter((item,index)=>{
      if(item.checked===true){
        return true;
      }
    })
  },