ElementUI（或在Vue 3中的对应版本Element Plus）提供了一套丰富的表单定义和验证规则，这些规则可以帮助开发者轻松地对用户输入进行校验。以下是一些常见的表单定义规则及其示例：

一、基本验证规则

1. 是否必填：通过required属性来设置字段是否为必填项。

• 示例：{ required: true, message: '用户名必填', trigger: 'blur' }

2. 验证消息提示：通过message属性来设置验证失败时显示的提示信息。

• 示例：{ required: true, message: '请输入正确的邮箱格式', trigger: 'blur' }

3. 验证触发方式：通过trigger属性来设置验证的触发方式，如blur（失去焦点时触发）或change（内容改变时触发）等。

• 示例：{ required: true, message: '请输入内容', trigger: 'change' }

二、数据类型验证

1. 字符串：默认类型，无需特别指定。

• 示例：验证用户名只能为字母和数字组合：{ pattern: /^[a-zA-Z0-9]+$/, message: '用户名只能包含字母和数字', trigger: 'blur' }

2. 数字：虽然输入控件接收的是字符串，但可以通过transform函数或在绑定时使用.number修饰符进行类型转换。

• 示例：使用.number修饰符：<el-input v-model.number="form.age" />

• 示例：使用transform函数：{ type: 'number', transform(value) { return Number(value); }, message: '请输入数字', trigger: 'blur' }

3. 整数和浮点数：通过type属性指定为integer或float，并可能需要使用transform函数进行类型转换。

• 示例：验证年龄为整数：{ type: 'integer', message: '年龄必须是整数', trigger: 'blur' }

4. 布尔值：通过type属性指定为boolean。

• 示例：验证是否同意条款：{ type: 'boolean', message: '请勾选同意条款', trigger: 'change' }

5. 数组和对象：通过type属性指定为array或object，并可以使用defaultField或fields进行深层验证。

{
  type: 'array',
  required: true,
  fields: {
	0: { type: 'string', required: true, message: '请输入姓名', trigger: 'blur' },
	1: { type: 'integer', required: true, message: '请输入年龄', trigger: 'blur' }
  }
}

• 示例：验证用户信息数组中的每个对象都包含有效的姓名和年龄：

三、自定义验证规则

通过validator函数可以实现自定义验证逻辑。该函数接收四个参数：规则对象rule、当前值value、回调函数callback（用于返回验证结果）以及源对象source和验证选项options（可选）。

• 示例：验证合同金额只能为数字和小数点，并保留两位小数：

var validatePrice = (rule, value, callback) => {
  value = String(value);
  if (value && value.split(".").length > 2) {
	callback(new Error("请输入正确格式的金额")); // 防止输入多个小数点
  } else if (value && value.split(".").length == 2) {
	value = Math.round(value * Math.pow(10, 2)) / Math.pow(10, 2); // 有小数点时四舍五入保留两位小数
	this.formInline.contractMoney = value;
	callback();
  } else {
	callback();
  }
};

// 在rules中使用自定义验证规则
contractMoney: [
  { required: false, validator: validatePrice, message: "请输入正确的合同金额", trigger: "blur" }
]

四、其他常用规则

1. 最大长度和最小长度：通过max和min属性来设置字符串或数组类型的最大和最小长度。

• 示例：验证密码长度在6到20个字符之间：{ min: 6, max: 20, message: '密码长度在6到20个字符之间', trigger: 'blur' }

2. 枚举验证：通过enum属性来指定值必须在指定的枚举集合中。

• 示例：验证角色只能是'admin'、'user'或'guest'之一：{ type: 'enum', enum: ['admin', 'user', 'guest'], message: '请选择有效的角色', trigger: 'change' }

3. 正则表达式验证：通过pattern属性来设置字段值必须匹配的正则表达式。

• 示例：验证邮箱格式：{ pattern: /^([a-zA-Z0-9]+[-_\.]?)+@[a-zA-Z0-9]+\.[a-z]+$/, message: '请输入正确的邮箱格式', trigger: 'blur' }

综上所述，ElementUI提供了丰富的表单定义和验证规则，可以满足大多数场景下的需求。开发者可以根据实际需要选择合适的规则进行组合和自定义，以实现高效的表单验证。