Skip to content

验证配置

验证配置用于约束表单输入内容,支持必填、范围、长度、正则和自定义规则等多种校验方式。它通常和字段属性、事件触发时机以及高级条件逻辑一起配合,决定表单能否稳定收敛到正确数据。

核心能力

验证规则是一种用于对输入数据进行约束和检查的机制,其核心功能在于确保数据的准确性、完整性和合规性,具体功能如下:

  1. 必填设置:明确指定某个字段是否为必填项。若设置为必填,用户必须提供该字段的值,否则数据提交将不被允许。
  2. 最大值/最小值校验:针对数值型数据,设定允许的最大值和最小值范围。输入的数据必须在这个区间内,否则判定为无效数据。
  3. 长度校验:适用于字符串类型的数据,规定字符串的最大长度和最小长度。输入的字符串长度需符合要求,超出或不足都会触发校验失败。
  4. 正则表达式校验:利用正则表达式这种强大的模式匹配工具,对输入数据的格式进行精确匹配。例如,验证邮箱地址、手机号码、身份证号码等特定格式的数据。
  5. 自定义验证:当上述内置规则无法满足复杂业务逻辑时,允许开发者编写自定义的验证函数或方法,根据特定的业务需求对数据进行校验。若你希望在校验函数里继续读取字段值、联动其他字段或主动触发校验,也可以结合表单 API$inject理解运行时能力。

应用场景示例

  • 用户注册表单
    • 必填设置:用户名、密码、邮箱等字段通常设置为必填,确保用户提供基本信息。
    • 长度校验:密码字段可能要求长度在 6 - 20 个字符之间,以保证密码的复杂度。
    • 正则表达式校验:邮箱字段使用正则表达式验证格式是否正确,如 ^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$
  • 商品信息表单
    • 必填设置:商品名称、价格、库存数量等为必填项,确保商品信息完整。
    • 最大值/最小值校验:价格字段设置最小值为 0,库存数量字段设置最小值为 0,避免出现负数等不合理数据。
    • 长度校验:商品描述字段限制最大长度,防止用户输入过长的描述影响页面展示。

内置验证规则

系统内置了多种常用验证规则,已经能够覆盖长度、数值范围、格式校验、字符约束和自定义验证等大多数场景。日常使用时,通常先根据规则类型选择内置能力,再补充提示语和触发方式;如果你需要查看更偏开发侧的规则结构说明,也可以继续阅读表单验证规则

基础验证规则

Key规则名称功能描述
len长度验证字符串长度等于指定值
minLen最小长度验证字符串最小长度
maxLen最大长度验证字符串最大长度
min最小值验证数值最小值
max最大值验证数值最大值

格式验证规则

Key规则名称功能描述
pattern正则表达式自定义正则表达式验证
email邮箱格式验证邮箱格式
urlURL 格式验证 URL 格式
ipIP 地址验证 IP 地址格式
phone手机号验证手机号格式

字符验证规则

Key规则名称功能描述
uppercase全大写验证必须为大写字母
lowercase全小写验证必须为小写字母
positive正数验证必须为正数
negative负数验证必须为负数
integer整数验证必须为整数
number数字验证必须为数字

高级验证规则

Key规则名称功能描述
validator自定义验证自定义验证函数
computed条件验证基于其他字段的验证

使用提示

  • 验证触发时机支持 blurchangesubmit 三种方式,建议按交互体验选择,不必所有规则都放在提交时统一触发。
  • 使用 pattern 时,如果直接写字符串,不要在前后再额外包 /,否则容易导致正则失效。
  • 自定义验证时,可通过 this.rulethis.api 读取当前组件和表单信息;如果需要进一步理解这些运行时能力,可以结合表单 API继续查看。
  • 自定义验证中无论成功还是失败,都应正确结束回调或返回结果,避免校验流程卡住。

功能说明

必填设置

是否必填开启之后,可以增加必填提示语,必填字段不输入不可提交;

提示语作用如下:

验证规则

最大值/最小值 功能说明:最大值/最小值一般用户限制数字的大小,比如金额输入的边界值限制。

应用场景示例:报销金额最小值为0.01,最大值为999999.99。

错误提示文字设置如下:

长度验证 功能说明:长度验证一般用输入内容字数长度验证,未通过校验时会提示错误信息。对于输入长度本身的交互限制,也可以继续搭配最大输入长度相关属性项一起使用。

应用场景示例:手机号必须为11位数字。

错误提示文字设置如下:

正则验证 功能说明:一些邮箱格式、手机号格式校验,可以使用正则验证。

应用场景包括:邮箱、域名、手机号、座机电话、身份证号、银行卡号、车牌号、中文、数字、整数、正整数、负整数、浮点数、正浮点数、负浮点数、英文字母、数字和字母

自定义验证 功能说明:一些特殊的校验规则,以上规则都不满足的时候,可以自定义验证规则。像“两个字段必须一致”“金额需同时满足上下限和业务状态”“根据用户身份决定是否通过”等场景,都更适合放在这里处理;若校验还依赖条件表达式,也可以继续结合逻辑条件使用计算公式

验证方式

验证方式包括失去焦点、内容改变、提交,可以自定义选择一种验证方式触发校验。实际项目里,这里的触发时机也常会和表单事件配置一起考虑,以避免过早校验或重复校验影响体验。

失去焦点指的是光标从选中内容区变为不选中; 内容改变指的是输入的内容发生变化; 提交指的是点击提交表单按钮。