多用在抽屉场景内的单/多选标签样式。
示例图

基础用法
页面 .json 文件 usingComponents 中引入组件
// json
{
"usingComponents": {
"mx-label": "/components/mxwui/label/index"
}
}页面 .wxml 文件中使用组件
<mx-label text="默认" />更多用法示例
按钮类型
属性:type,可选值 default 默认、single 单选选中、multiple 多选选中、disabled 禁用,默认值 default。
- 默认
type="default"
<mx-label type="default" text="默认" />- 单选选中
type="single"
<mx-label type="single" text="单选选中" />- 多选选中
type="multiple"
<mx-label type="multiple" text="多选选中" />- 禁用
type="disable"
<mx-label type="disable" text="禁用" />自定义文案
属性:text,按钮显示的文案。
<mx-label text="自定义文案" />自定义文本色
属性:defaultColor,自定义文本色,默认 #040A23,任何合法的颜色值。
<mx-label type="default" text="默认" defaultColor="#1677FF" />自定义选中颜色
属性:defaultColor,自定义选中颜色,默认 #CA0E2D,只支持十六进制颜色值,因为涉及背景色、角标的颜色生成。
<mx-label type="single" text="单选选中" selectColor="#1677FF" />
<mx-label type="multiple" text="多选选中" selectColor="#1677FF" />事件
<mx-label text="默认" bind:label_tap="handleClick" />参数
| 参数 | 类型 | 必填 | 可选值 | 默认值 | 参数描述 |
|---|---|---|---|---|---|
| type | String | 是 | default、single、multiple、disable |
default |
类型,默认、单选、多选、禁用 |
| text | String | 是 | 文案 | ||
| defaultColor | String | 是 | 颜色值 | #040A23 |
默认文本色 |
| selectColor | String | 是 | 颜色值 | #CA0E2D |
选中颜色,只支持十六进制颜色值 |
事件
| 事件名称 | 类型 | 返回值 | 事件说明 |
|---|---|---|---|
| bind:label_tap | Click | 点击事件 |
其他说明
- 当一组标签使用时可以自行维护数据,动态变更
type的属性值,达到选中某项值或选中多个值的目的