amis2/docs/zh-CN/components/form/chain-select.md
liaoxuezhi 65ac422ed6
1.2.x 文档&示例配置调整 (#2064)
* 补充容错

* fix: form 中 name 关联顶层数据初始化失效

* 更新 examples

* 文档调整

* 删除多余的文档, 调整 schema

* schema 调整

* schema 调整

* control 类型容器 control 改成 body

* 修复一个选项加载的bug

* form 注册直接用 type
2021-06-07 10:09:55 +08:00

3.1 KiB
Executable File
Raw Blame History

title description type group menuName icon order
Chain-Select 链式下拉框 0 null Chain-Select 7

基本用法

用于实现无限级别下拉,只支持单选,且必须和 source 搭配,通过 API 拉取数据,只要 API 有返回结果,就能一直无限级别下拉。

{
    "type": "form",
    "debug": true,
    "api": "https://3xsw4ap8wah59.cfc-execute.bj.baidubce.com/api/amis-mock/mock2/form/saveForm",
    "body": [
        {
            "name": "select3",
            "type": "chained-select",
            "label": "级联下拉",
            "source": "https://3xsw4ap8wah59.cfc-execute.bj.baidubce.com/api/amis-mock/mock2/options/chainedOptions?waitSeconds=1&parentId=$parentId&level=$level&maxLevel=4",
            "value": "a,b"
        }
    ]
}

source接口中配置的参数waitSeconds=1maxLevel=4是测试接口所需参数,实际使用自己接口时不需要添加这两个参数

暴露参数

为了帮助后端接口获取当前选择器状态chained-select 会默认给 source 接口的数据域中,添加若干个参数:

  • value: 选中的表单项值;
  • level: 当前拉取数据时的层级,
  • parentId: 上一级选项的值,数据格式基于配置的joinValuesextractValue属性
  • parent: 上一级选项的完整的数据格式

属性表

除了支持 普通表单项属性表 中的配置以外,还支持下面一些配置

属性名 类型 默认值 说明
options Array<object>Array<string> 选项组
source stringAPI 动态选项组
autoComplete stringAPI 自动选中
delimiter string , 拼接符
labelField boolean "label" 选项标签字段
valueField boolean "value" 选项值字段
joinValues boolean true 拼接值
extractValue boolean false 提取值