Проверка Formik на уровне поля

Недавно я перешел с Redux-Form на Formik, в основном из-за проблем с производительностью. Что мне понравилось в валидации на уровне поля в редукционной форме, так это составная валидация на уровне поля, которую можно передать массиву функций валидации.

В редукционной форме вы можете сделать что-то вроде этого. Библиотека будет запускать все функции проверки одну за другой, если предыдущая функция прошла успешно, в противном случае произойдет первая ошибка проверки.

<Field name="email" label="Email" component={Text} validate={[required, validateEmail]}/>

Но в Formik вы можете передать только одну функцию проверки, как показано ниже, что означает, что вы можете проверять только одну вещь за раз, или вам нужно написать большую пользовательскую функцию, которая обрабатывает все случаи для этого поля.

<Field name="email" label="Email" component={Text} validate={validateEmail}/>

Но мы могли бы следовать концепции проверки на уровне поля в избыточной форме и написать нашу собственную функцию для обработки этого, как показано ниже.

export const customFieldLevelValidation = (value, validations) => {
    for (let validation of validations) {
        const result = validation(value);
        if (result) {
            return result;
        }
    }
    return null;
};

Теперь мы можем повторно использовать функцию customFieldLevelValidation везде в форме. Как видно, мы можем передать в массив столько пользовательских функций, сколько захотим.

const validateEmail = (value) => customFieldLevelValidation(value, [isRequired, checkInputLength]);

Теперь мы передаем эту функцию нашему полю.

<Field name="email" label="Email" component={Text} validate={validateEmail}/>