您好,欢迎来到三六零分类信息网!老站,搜索引擎当天收录,欢迎发信息

微信小程序组件解读和分析:checkbox复选项介绍

2024/3/9 23:29:39发布25次查看
checkbox复选项组件说明:
checkbox是小程序表单组件中的一个组件,作用是在表单中引导用户做出选择。
要使用checkbox组件,还需要在同组中所有的checkbox标签外使用checkbox-group标签。
checkbox-group标签的作用是可以为其中的checkbox标签绑定onchange事件,当用户做出选择的时候可以引导用户。
单独的checkbox标签不会触发onchange事件,只有在checkbox-group上绑定才会触发。
checkbox复选项组件示例代码运行效果如下:
下面是wxml代码:
<view> <checkbox-group class="checkbox-group" bindchange="changed"> <label class="items" wx:for="{{item}}"> <checkbox value="{{item.value}}" checked="{{item.checked}}" disabled="{{item.disabled}}"/> {{item.name}} </label> </checkbox-group> </view>
下面是js代码:
page({ data:{ item: [ {'name': '俄罗斯', 'value': 'rs', 'disabled': false}, {'name': '美国', 'value': 'us', 'disabled': false}, {'name': '中国', 'value': 'cn', 'disabled': false, 'checked': true}, {'name': '英国', 'value': 'uk', 'disabled': false}, {'name': '日本', 'value': 'jp', 'disabled': true} ] }, changed: function(e) { console.info('你选择了' + e.detail.value); } })
下面是wxss代码:
.items { display: block; margin: 30rpx; }
checkbox复选项的主要属性:
checkbox-group
属性名称
数据类型
描述
bindchange
eventhandle
f40c9b9d2e8a72c8df488dd6c09a1160中选中项发生改变是触发 change 事件,detail = {value:[选中的checkbox的value的数组]}
checkbox
属性名称
数据类型
描述
默认值
value
string
a2f269297782d34318beedfba321faa2 标识,选中时触发 f40c9b9d2e8a72c8df488dd6c09a1160 的 change 事件,并携带 a2f269297782d34318beedfba321faa2 的value值
checked
boolean
是否使 a2f269297782d34318beedfba321faa2 默认被选中
false
disabled
boolean
是否使 a2f269297782d34318beedfba321faa2 被禁用
false
以上就是微信小程序组件解读和分析:checkbox复选项介绍的详细内容。
该用户其它信息

VIP推荐

免费发布信息,免费发布B2B信息网站平台 - 三六零分类信息网 沪ICP备09012988号-2
企业名录 Product