amis2/docs/zh-CN/components/form/list-select.md

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，多值用,分隔