如何在Yup中将密码长度校验与正则校验合并为同一步骤

解决方案 #

可以合并，你只需在原有正则的正向预查规则中新增长度校验规则，就能通过一次matches调用同时满足长度、字符组合两项校验要求。

合并后的正则 #

新增(?=.{8,})预查规则限制最小长度为8位，完整正则如下：
/^(?=.{8,})(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@#$%^&+=])/

完整代码示例 #

export const signinSchema = yupResolver(
  yup.object().shape({
    username: yup.string().required("邮箱为必填项"),
    password: yup
      .string()
      .required("密码为必填项")
      .matches(/^(?=.{8,})(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@#$%^&+=])/, {
        message: "密码长度不能少于8位，且必须同时包含大写字母、小写字母、数字和指定特殊字符"
      })
  })
)

补充说明 #

如果你的业务需要分别提示「长度不足」和「字符组合不符合要求」两类不同的错误，不建议合并规则，分开编写min和matches可以触发对应场景的专属错误提示，用户体验更好。

内容的提问来源于stack exchange，提问作者Lê Quốc Khánh