Formik FieldArray Validation не проверяется

Question

Я использую объект Formik FormArray и пытаюсь использовать проверку, похоже, не работает.

1. Даже при простой обязательной проверке все еще разрешается отправлять пустые поля
2. Когда я добавляю регулярные выражения, он выдает ошибки
3. Я не знаю, еслисообщения об ошибках показывают
4. Трудно отладить

Вот фрагменты моего примера формы (извините, это не полный код, а все в родительских контейнерах):

    const validationSchema = Yup.object().shape({

      domains: Yup.array()
        .required('Required')
        .matches(/^(?!:\/\/)([a-zA-Z0-9-_]+\.)*[a-zA-Z0-9][a-zA-Z0-9-_]+\.[a-zA-Z]{2,11}?$/, {
          message: 'Invalid Domain',
          excludeEmptyString: true,
        })
        .matches(/(www\.| http: \/\/|https:\/\/)/, {
          message: 'Should not contain www.| http:// | https://',
          excludeEmptyString: true,
        })
    })

    const ErrorMessage = ({ name }) => (
      <Field
        name={name}
        render={({ form }) => {
          const error = getIn(form.errors, name)
          const touch = getIn(form.touched, name)
          return touch && error ? error : null
        }}
      />
    )

    {
      ({ handleChange, handleBlur, values, errors, touched }) => (
        <FormGroup>

          <Label>Domains</Label>

          <FieldArray
            name="domains"
            render={arrayHelpers => (
              <>
                <ul className="list-unstyled">
                  {values.domains.map((domain, index, domains) => (
                    <li className="mb-2" key={index}>
                      <InputGroup>
                        <Field
                          name={`domains[${index}]`}
                          className="form-control"
                        />
                        <InputGroupAddon addonType="append">
                          <Button
                            color="primary"
                            onClick={() => arrayHelpers.remove(index)}
                          >
                            <strong>x</strong>
                          </Button>
                        </InputGroupAddon>
                        <ErrorMessage name={`domains[${index}]`} />
                      </InputGroup>
                    </li>
                  ))}
                  <Button
                    className="mt-2"
                    color="secondary"
                    onClick={() => arrayHelpers.push('')}
                  >
                    Add a Domain
                              </Button>
                </ul>
              </>
            )}
          />

        </FormGroup>

Я пытался удалить проверку регулярных выражений, но это не сработало.Кто-нибудь может порекомендовать, как это сделать?Спасибо

Answer 1

https://jaredpalmer.com/formik/docs/api/fieldarray

Пример на сайтах сайтов formik для массива объектов:

    const schema = Yup.object().shape({
      domains: Yup.array()
        .of(
          Yup.object().shape({
            name: Yup.string()
              .min(4, 'too short')
              .required('Required'), // these constraints take precedence

Для доступа к массиву строк:

       domains: Yup.array().of(
         Yup.string()
         .trim()
         .required('Required')