微信小程序学习(11)-checkbox控件和label标签

复选框控件，实现多重选择功能。通过checkbox-group标签，包裹所以checkbox标签来实现，中间可以嵌入其他控件。

1.控件属性

注意：disabled不是不能选中，是禁止交互，如果一个checkbox的checked设置为true，disabled设置为true，该项也会被选中，只是不能进行点击交互。

2.代码实现

2.1>  wxml文件的代码

  
  中间可以嵌入其他控件
  这是嵌入的button控件
  
  
    {{item.value}}
  

2.2> .js控制层的代码

Page({
  data: {
    items: [
      {name: 'USA', value: '美国'},
      //checked为truetrue，所以该项默认选中
      {name: 'CHN', value: '中国', checked: 'true'},
      {name: 'BRA', value: '巴西'},
      // disabled为truetrue，所以该项不能被点击，checked为truetrue，默认选中，但是不能点击
      {name: 'JPN', value: '日本',disabled:'true', checked: 'true'},
      {name: 'ENG', value: '英国'},
      {name: 'TUR', value: '法国'},
    ]
  },
  // checkbox点击的时候会执行这个方法
  checkboxChange: function(e) {
    console.log('checkbox发生change事件，携带value值为：', e.detail.value)
  }
})

3.label标签

label标签与html中的标签作用完全一样，把checkbox上显示的每个选项的内容与选择框进行绑定，实现点击文字也能选中该项目

4.整体效果