微信小程序开发教程——1.0.7checkbox 组件

7.1 checkbox

多选项目。

属性 默认值 必填 类型 说明 最低版本
value string checkbox标识,选中时触发checkbox-group的 change 事件,并携带 checkbox 的 value 1.0.0
disabled false boolean 是否禁用 1.0.0
checked false boolean 当前是否选中,可用来设置默认选中 1.0.0
color #09BB07 string checkbox的颜色,同css的color 1.0.0

7.2 checkbox-group

多项选择器,内部由多个checkbox组成。

属性 类型 默认值 必填 说明 最低版本
bindchange EventHandle checkbox-group中选中项发生改变时触发 change 事件,detail = {value:[选中的checkbox的value的数组]} 1.0.0

7.3 示例代码:

wxml

<checkbox-group bindchange="checkboxChange">
  <label class="checkbox" wx:for="{{items}}">
    <checkbox value="{{item.name}}" checked="{{item.checked}}"/>{{item.value}}
  </label>
</checkbox-group>

js

Page({
  data: {
    items: [
      { name: 'USA', value: '美国' },
      { name: 'CHN', value: '中国', checked: 'true' },
      { name: 'BRA', value: '巴西' },
      { name: 'JPN', value: '日本' },
      { name: 'ENG', value: '英国' },
      { name: 'TUR', value: '法国' },
    ]
  },
  checkboxChange: function (e) {
    console.log('checkbox发生change事件,携带value值为:', e.detail.value)
  }
})
上一篇:微信小程序开发(五)-常⻅组件


下一篇:微信小程序 checkbox 复选框标签