0%

微信小程序学习之checkbox组件

一、实现效果

二、代码部分

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!--学习checkbox组件-->
<view class="title">学习checkbox组件</view>
<view class="student">2016/12/13 vsiryxm@qq.com</view>
<view>
<text>
1、checkbox-group是一个多选项组。
2、value属性为checkbox的值,当选中状态发生变化时,会触发bindchange指向的事件。
3、disabled属性默认为false,也就是可用状态,如果需要禁用checkbox,将其设置为true。
4、checked属性设置checkbox是否被选中,与网页的功能一样。
5、不像网页那样,有name和id属性,个人暂时觉得不习惯不好用,待更多场景使用。
\n</text>
</view>
<view class="section">多项选择器组效果:</view>
<view>
<checkbox-group bindchange="chkChange">
<label class="checkbox" wx:for="{{items}}" wx:for-id="id" wx:for-item="item">
<checkbox name="yyy" value="{{item.value}}" checked="{{item.checked}}" /> {{item.name}}
</label>
</checkbox-group>
</view>
<view class="section">单个效果:</view>
<view>
<checkbox-group bindchange="chkChange">
<checkbox value="1" bindchange="chkChange" /> 审核通过
</checkbox-group>
</view>