2.3.2微信小程式表單元件 checkbox
阿新 • • 發佈:2019-01-24
微信小程式表單元件 checkbox
checkbox-group
多選專案組,內部由多個checkbox
組成。
checkbox-group內只能包含checkbox
屬性名 | 型別 | 預設值 | 說明 |
---|---|---|---|
bindchange | EventHandle | checkbox-group中選中項發生改變是觸發change事件,detail = {value:[選中的checkbox的value的陣列]} |
checkbox
多選專案。
屬性名 | 型別 | 預設值 | 說明 |
---|---|---|---|
value | String | checkbox標識,選中時觸發checkbox-group的change事件,並攜帶checkbox的value | |
disabled | Boolean | false | 是否禁用 |
checked | Boolean | false | 當前是否選中,可用來設定預設選中 |
color | Color | checkbox的顏色,同css的color |
示例:
<checkbox-groupbindchange="checkboxChange">
<labelclass="checkbox"wx:for-items="{{items}}">
<checkboxvalue="{{item.name}}"checked="{{item.checked}}"/>{{item.value}}
</ label>
</checkbox-group>
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)
}
})