教程 yup tutorial

常用数据类型

Yup 提供了多种内置数据类型的 Schema,能够满足大多数应用场景。
每种类型都支持链式方法来自定义验证规则。

字符串(string)

js
const schema = yup.string().required().min(3).max(10).email();

`

  • required():必填
  • min(length):最小长度
  • max(length):最大长度
  • email():必须是合法邮箱

数字(number)

js
const schema = yup.number().required().positive().integer();
  • positive():必须为正数
  • integer():必须为整数
  • min(value) / max(value):最小值和最大值

布尔值(boolean)

js
const schema = yup.boolean().oneOf([true], "必须勾选同意");
  • oneOf([true]):通常用于同意协议、勾选框验证

日期(date)

js
const schema = yup.date().min(new Date(2020, 0, 1)).max(new Date(2030, 11, 31));
  • min(date):不得早于指定日期
  • max(date):不得晚于指定日期

混合类型(mixed)

js
const schema = yup.mixed().required();
  • 可用于任何数据类型
  • 常配合 oneOf()、notOneOf() 使用

小结

  • 字符串:验证文本、邮箱、长度
  • 数字:验证范围、正负、是否整数
  • 布尔:常用于开关、勾选框
  • 日期:限制时间范围
  • 混合:适配特殊场景

接下来,我们将深入学习 Yup 的 验证规则。