微信小程序checkbox复选框

微信小程序checkbox复选框

效果:

相比单选框,多选框可同时选中多个选项,并返回其value值微信小程序checkbox复选框_第1张图片
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    
})    
}
})

你可能感兴趣的:(微信小程序,小程序,checkbox)