amis/docs/zh-CN/components/form/text.md
吴多益 0ae04ce946
docs:将文档移动 zh-CN 目录下;为以后支持英文版做准备 (#1309)
* docs:将文档移动 zh-CN 目录下;为以后支持英文版做准备

* 整理 autoFill

* 补充下载最新版本的说明 (#1298)

* fix: 修复在新版 Firefox 下 js sdk 报错 (#1300)

* 删掉可能报错的代码 (#1311)

* fix: 修复 css 变量不支持数字问题 (#1302)

* feat:增加 animation-duration,可以控制所有动画时长,也能用于一次性关闭所有动画效果 (#1303)

* feat:增加 animation-duration,可以控制所有动画时长,也能用于一次性关闭所有动画效果

* 补充文档

* Pageleave (#1310)

* form 添加页面离开提示功能

* 补充文档

Co-authored-by: 2betop <2betop.cn@gmail.com>
Co-authored-by: liaoxuezhi <liaoxuezhi@baidu.com>
2021-01-04 16:59:32 +08:00

5.6 KiB
Executable File

title description type group menuName icon order
Text 输入框 0 null Text 输入框 56

基本使用

{
    "type": "form",
    "api": "https://houtai.baidu.com/api/mock2/form/saveForm",
    "controls": [
        {
            "name": "text",
            "type": "text",
            "label": "text"
        }
    ]
}

不同类型

配置type可以支持不同格式的文本输入框

{
    "type": "form",
    "api": "https://houtai.baidu.com/api/mock2/form/saveForm",
    "controls": [
        {
            "name": "text",
            "type": "text",
            "label": "text"
        },
        {
            "type": "divider"
        },
        {
            "type": "url",
            "name": "url",
            "label": "链接"
        },
        {
            "type": "divider"
        },
        {
            "type": "email",
            "name": "email",
            "label": "邮箱"
        },
        {
            "type": "divider"
        },
        {
            "type": "password",
            "name": "password",
            "label": "密码"
        }
    ]
}

附加组件

可以配置addOn,附带附加组件

{
    "type": "form",
    "api": "https://houtai.baidu.com/api/mock2/form/saveForm",
    "controls": [
        {
            "name": "text",
            "type": "text",
            "label": "text",
            "addOn": {
                "type": "button",
                "label": "搜索"
            }
        }
    ]
}

选择器模式

配置options即可支持选择器模式。

{
    "type": "form",
    "api": "https://houtai.baidu.com/api/mock2/form/saveForm",
    "controls": [
        {
            "name": "text",
            "type": "text",
            "label": "text",
            "options": [
                {
                    "label": "OptionA",
                    "value": "a"
                },
                {
                    "label": "OptionB",
                    "value": "b"
                },
                {
                    "label": "OptionC",
                    "value": "c"
                },
                {
                    "label": "OptionD",
                    "value": "d"
                }
            ]

        }
    ]
}

选择器模式下,支持部分选择器组件支持的配置项,具体请查看下面的属性表

属性表

当做选择器表单项使用时,除了支持 普通表单项属性表 中的配置以外,还支持下面一些配置

属性名 类型 默认值 说明
options Array<object>Array<string> 选项组
source stringAPI 动态选项组
autoComplete stringAPI 自动补全
multiple boolean 是否多选
delimeter string , 拼接符
labelField string "label" 选项标签字段
valueField string "value" 选项值字段
joinValues boolean true 拼接值
extractValue boolean false 提取值
addOn addOn 输入框附加组件,比如附带一个提示文字,或者附带一个提交按钮。
addOn.type string 请选择 textbutton 或者 submit
addOn.label string 文字说明
addOn.xxx string 其他参数请参考按钮文档
trimContents boolean 是否去除首尾空白文本。
clearable boolean 是否可清除
resetValue string "" 清除后设置此配置项给定的值。