微信小程序开发-多项选择器（checkbox-group）

多项选择器，内部由多个checkbox组成。可以用来实现多选框的效果。

实现代码：

<checkbox-group class="group" bindchange="checkboxChange">
    <view class="label-1" wx:for="{{checkboxItems}}" wx:key="id">
        <label>
            <checkbox value="{{item.name}}" checked="{{item.checked}}"></checkbox>
            <text class="label-1-text">{{item.value}}</text>
        </label>            
    </view>                   
</checkbox-group>

checkbox-group绑定了checkboxChange的方法：

checkboxChange: function (e) {
    this.setData({
       labels: e.detail.value
    })
}

另外还有一个checkboxItems的数组需要提前定义：

data: {
        checkboxItems: [{
                name: 'activity',
                value: '精彩分享',
                checked: 'true'
            },
            {
                name: 'online',
                value: '活动预告（线上）'
            },
            {
                name: 'offline',
                value: '活动预告（线下）'
            }
        ],
        labels: ["activity"]
    }

如此，就实现了多选框的效果：

其中第一个框默认是已勾选。