mirror of
https://gitee.com/baidu/amis.git
synced 2024-12-15 17:31:18 +08:00
e6d2b2a035
* fix:修复部分组件事件动作问题&补充组件动作表文档&规范事件动作参数类型 * fix:修复部分组件事件动作问题&补充组件动作表文档&规范事件动作参数类型 * fix:input-range类型声明问题 * fix:input-range单测问题 * fix:input-range单测u snapshot
4.6 KiB
Executable File
4.6 KiB
Executable File
title | description | type | group | menuName | icon | order |
---|---|---|---|---|---|---|
ListSelect 列表 | 0 | null | ListSelect | 29 |
ListSelect 一般用来实现选择,可以单选也可以多选,和 Radio/Checkboxs 最大的不同是在展现方面支持带图片。
基本用法
{
"type": "form",
"api": "/api/mock2/form/saveForm",
"body": [
{
"type": "list-select",
"name": "select",
"label": "单选",
"clearable": true,
"options": [
{
"label": "Option A",
"value": "a"
},
{
"label": "Option B",
"value": "b"
}
]
}
]
}
选项带图片
{
"type": "form",
"api": "/api/mock2/form/saveForm",
"body": [
{
"type": "list-select",
"name": "select",
"label": "图片",
"options": [
{
"label": "OptionA",
"value": "a",
"image": "https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg"
},
{
"label": "OptionB",
"value": "b",
"image": "https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg"
},
{
"label": "OptionC",
"value": "c",
"image": "https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg"
},
{
"label": "OptionD",
"value": "d",
"image": "https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg"
}
]
}
]
}
属性表
当做选择器表单项使用时,除了支持 普通表单项属性表 中的配置以外,还支持下面一些配置
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
options | Array<object> 或Array<string> |
选项组 | |
source | string 或 API |
动态选项组 | |
multiple | boolean |
false |
多选 |
labelField | string |
"label" |
选项标签字段 |
valueField | string |
"value" |
选项值字段 |
joinValues | boolean |
true |
拼接值 |
extractValue | boolean |
false |
提取值 |
autoFill | object |
自动填充 | |
listClassName | string |
支持配置 list div 的 css 类名。比如: flex justify-between |
事件表
事件名称 | 事件参数 | 说明 |
---|---|---|
change | value: string 选中值 |
选中值发生变化时触发 |
动作表
动作名称 | 动作配置 | 说明 |
---|---|---|
clear | - | 清空 |
reset | - | 将值重置为resetValue ,若没有配置resetValue ,则清空 |
reload | - | 刷新(重新加载),只针对配置了source 的点选按钮有效 |
setValue | value: string 更新的值 |
更新数据,开启multiple ,多值用, 分隔 |