Question

我在我的React应用程序中结合使用yup和Formik来验证TypeScript模型/接口。我们之前有一个用于以下架构的yup.object：

export const InputSchema = yup.object({
  id: yup.string(),

  name: yup.string().required().min(MIN_DESC_LENGTH).max(_MAX_NAME_LENGTH),

  description: yup.string().required().matches(/(?!^\d+$)^[\s\S]+$/, 'Please enter a valid description').min(MIN_DESC_LENGTH).max(_MAX_DESC_LENGTH),

  contact: yup.string().required()
});

当我们现在更改界面时，name和description字段可以是string或object。

我仍然想用yup来验证表单，因此我尝试使用name: yup.mixed()和description: yup.mixed()，但是现在min.()和{{1 }}函数。

是否可能有.matches()或string条件？因此，如果它是object，则将使用yup.string()，否则将使用min/max。

Answer 1

我正在寻找一种简单的方法来执行此操作，但找不到任何方法，但是他们提供的解决方案是使用yup.lazy。

您的情况应该是

Yup.object({
    ...
    name: Yup.lazy(value => {
      switch (typeof value) {
        case 'object':
          return Yup.object(); // schema for object
        case 'string':
          return Yup.string().min(MIN_DESC_LENGTH).max(_MAX_NAME_LENGTH); // schema for string
        default:
          return Yup.mixed(); // here you can decide what is the default
      }
    }),
    ...
})

您可以做的另一种方法是像这样gist。
它使用.addMethod创建一个自定义方法，该方法接收模式并验证所有模式。很好的方法

带yup验证的条件对象或字符串类型

1 个答案: