是的 JS 验证模式依赖项

Question

我有一个像这样的 Yup Schema...

code: Yup.string()
  .min(3, 'Must be at least 3 characters')
  .required('Code is required')
  .test('unique-code', 'Code is taken', productCodeValidator),

...其中 .test('unique-code' 进行 API 调用以确认代码是唯一的。我只想在前两次通过（最小，必需）时触发该验证器，但我找不到可以做到这一点的 Yup 方法。

我试过 .when 但这似乎只适用于 sibling 字段，而且我在文档中没有看到任何关于不运行后续较早的验证器失败时的验证器。

感谢任何帮助，谢谢！

Answer 1

This is not currently possible because all validations run at the same time to maintain performance. There have been a number of other requests for this as well. For example, this is a similar request: #256 (https://github.com/jquense/yup/issues/256). I am in favor of there being some way to handle some or all validations in some order/sequence.

参考文献：

如果您在 Formik 中使用模式，您应该定义一个自定义验证函数 (https://itnext.io/simple-react-form-validation-with-formik-yup-and-or-spected-206ebe9e7dcc)，并且您可以在其中验证内联第一个条件（例如使用 basicSchema.validate(data)）如果它们 return 为真，您可以验证另一个条件。

Answer 2

是的允许你通过Yup.addMethod()

自定义一个方法来实现功能

所以一个名为 sequence 的包装器方法可以是这样的：

Yup.addMethod(Yup.string, 'sequence', function (funcList) {
  return this.test(async (value, context) => {
    try {
      for (const func of funcList) {
        await func().validate(value);
      }
    } catch ({ message }) {
      return context.createError({ message });
    }
    return true;
  });
});

假设您有一个名为 uniqueUsername 的 api 用于检查唯一性，它是一个 axiosInstance。那么我们可以这样做：

username: Yup.string().sequence([
        () => Yup.string().max(20).required('Username is required'), // check format first
        () => Yup.string().unique('Username is already taken', uniqueUsername),  // check uniqe via api
      ]),

函数sequence会按顺序检查列表。

PS：unique 函数的代码：

Yup.addMethod(Yup.string, 'unique', function (message, axiosInstance) {
  return this.test('unique', message, async (value) => {
    const { data } = await axiosInstance(value);
    return data;
  });
});

是的 JS 验证模式依赖项

Yup JS validation schema depedencies

javascript

yup