amis2/docs/renderers/FormItem.md

FormItem

Form 中主要是由各种 FormItem 组成。FormItem 中主要包含这些字段。

• name 字段名，表单提交时的 key。

• value 值，可以通过它设置默认值。

• label 描述标题，当表单为水平布局时，左边即便是不设置 label 为了保持对齐也会留空，如果想要去掉空白，请设置成 false。

• description 描述内容。

• placeholder 占位内容。

• type 指定表单类型，如： text、textarea、date、email等等

• inline 是否为 inline 模式。

• submitOnChange 是否该表单项值发生变化时就提交当前表单。

• className 表单最外层类名。

• disabled 当前表单项是否是禁用状态。

• disabledOn 通过表达式来配置当前表单项的禁用状态。

• visible 是否可见。

• visibleOn 通过表达式来配置当前表单项是否显示。

• hidden 是否隐藏，不要跟 visible visibleOn 同时配置

• hiddenOn 通过表达式来配置当前表单项是否隐藏。

• inputClassName 表单控制器类名。

• labelClassName label 的类名。

• required 是否为必填。

• requiredOn 通过表达式来配置当前表单项是否为必填。

• validations 格式验证，支持设置多个，多个规则用英文逗号隔开。

  • isEmptyString 必须是空白字符。
  • isEmail 必须是 Email。
  • isUrl 必须是 Url。
  • isNumeric 必须是 数值。
  • isAlpha 必须是 字母。
  • isAlphanumeric 必须是 字母或者数字。
  • isInt 必须是 整形。
  • isFloat 必须是 浮点形。
  • isLength:length 是否长度正好等于设定值。
  • minLength:length 最小长度。
  • maxLength:length 最大长度。
  • maximum:length 最大值。
  • minimum:length 最小值。
  • equals:xxx 当前值必须完全等于 xxx。
  • equalsField:xxx 当前值必须与 xxx 变量值一致。
  • isJson 是否是合法的 Json 字符串。
  • notEmptyString 要求输入内容不是空白。
  • isUrlPath 是 url 路径。
  • matchRegexp:/foo/ 必须命中某个正则。
  • matchRegexp1:/foo/ 必须命中某个正则。
  • matchRegexp2:/foo/ 必须命中某个正则。
  • matchRegexp3:/foo/ 必须命中某个正则。
  • matchRegexp4:/foo/ 必须命中某个正则。 如：

  {
    "validations": "isNumeric,minimum:10",
  
    // 或者对象配置方式, 推荐
    "validations": {
      "isNumeric": true,
      "minimum": 10
    }
  }
  

• validationErrors 自定义错误提示, 配置为对象, key 为规则名, value 为错误提示字符串(提示:其中$1表示输入) 如：

  {
      "validationErrors": {
          "isEmail": "请输入正确的邮箱地址"
      }
  }
  

• validateOnChange 是否修改就验证数值，默认当表单提交过就会每次修改验证，如果要关闭请设置为 false，即便是关了，表单提交前还是会验证的。

{
  "type": "text",
  "name": "test1",
  "label": "Label",
  "description": "Description...",
  "placeholder": "Placeholder",
  "validateOnChange": true,
  "validations": "matchRegexp: /^a/, minLength:3,maxLength:5",
  "validationErrors": {
    "matchRegexp": "必须为a开头",
    "minLength": "小伙伴，最低为$1个字符!"
  }
}

不同类型的表单，可配置项还有更多，具体请看下面对应的类型。