yup.js 多个测试验证器

如何解决yup.js 多个测试验证器

我有验证器的自定义方法

export function required(value: any) {
  const { path,createError } = this;
  if (value === null || value === undefined || !value) {
    return createError({ path: path,message: 'common.required-error.key' });
  }
  return true;
}


export function email(value: string) {
  const regex = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
  const testResult = regex.test(String(value).toLowerCase());
  const { path,createError } = this;

  if (!testResult) {
    return createError({ path: path,message: 'common.email-error.key' });
  }

  return true;
}

这些是我用来验证输入字段的方法 自定义表单组件和控件

<Form validators={{ control1: required,control2: [required,email]  }} submitHandler={submit}>
          <FormControl type="text" formControlName="control1"></FormControl>
          <FormControl type="email" formControlName="control2"></FormControl>
        </Form>

在使用库的 Form.tsx 组件中，我创建了我的测试函数方法

const { register,handleSubmit,formState,getValues } = useForm({
    resolver: yupResolver(buidlValidators(validators,t)),// mode: 'onChange',// reValidateMode: 'onChange',});


function buidlValidators(validators: Record<string,yup.TestFunction | yup.TestFunction[]>,t: (key: string) => any) {
  const result = {};

  for (const key in validators) {
    const value = validators[key];
    if (Array.isArray(value)) {
      result[key] = functionСhain(value,key);
    } else {
      result[key] = yup.mixed().test(value.name,null,value);
    }
  }

  console.log({ buidlValidators: result })
  return yup.object().shape(result);
}





function functionСhain(functions: yup.TestFunction[],name: string) {
  let validator = yup.mixed();
  for (const value of functions) {
    validator = validator.test(value.name,value);
  }
  return validator;
}

但我收到此错误

control1: {message: "common.required-error.key",type: "required",ref: input}
control2: {message: "common.required-error.key",ref: input}

但我想得到这样的东西

control1: {message: "common.required-error.key",ref: input}
control2: {message: ["common.required-error.key","common.email-error.key"],ref: input}

我想了解如何正确执行以获得我想要的结果