微信小程序checkbox复选框

微信小程序checkbox复选框

效果：

相比单选框，多选框可同时选中多个选项，并返回其value值
wxml代码：

<view>
<checkbox-group bindchange="handlemorechange">  
<checkbox value="{{item.value}}" wx:for="{{list}}" wx:key="id">
{{item.name}} 
</checkbox>
</checkbox-group>
<view>  选中的水果：{{checklist}}</view>
</view>

Page({    
data:{      
list:[      
{        
id:0,        
name:"🍎",        
value:"apple"      
},      
{        
id:1,        
name:"🍌",        
value:"banana"      
},      
{        
id:2,        
name:"🍇",        
value:"grape"      
}      
],      
checklist:[]//定义数组接收选中水果的值    
},    
handlemorechange(e){
this.setData({      
checklist:e.detail.value    
})    
}
})