Как обработать вызов проверки API в formik - PullRequest
1 голос
/ 02 мая 2020

У меня есть поле с именем email, которое проверяет формат электронной почты с использованием validationSchema как

email: yup.string().required('required').email() 

, а также интегрирует некоторый API, который проверяет дубликаты электронной почты, когда пользователь отправляет форму (API вызывается в handleSubmit, чтобы убедиться, что этот адрес электронной почты будет в правильном формате) и будет устанавливать поле ошибки, когда сервер уже ответил. Таким образом, поток здесь такой:

Checking an email format (onBlur and onChange) -> user press submit form -> call API checking  duplicate email -> if email is already exist then setFieldError as 'Email is already exist' or otherwise submit the form. 

. Эта работа работает, как и ожидалось, но проблема возникает, когда форма содержит более одного поля. Все поля проверяются, когда внутри формы происходят какие-либо изменения. Если у меня есть 2 поля электронной почты и пароль. После отправки дубликата пользователем в поле электронной почты отображается сообщение «Электронная почта уже существует», но при обновлении значения в поле пароля Ошибка в электронной почте исчезнет и будет подтверждена validationSchema, даже если в ее поле не внесены изменения. Любое предложение по этому поводу?

1 Ответ

0 голосов
/ 07 мая 2020

Один из способов решить эту проблему, который не является лучшим, - сделать проверку формы только при отправке. Это означает передачу false в validateOnBlur и validateOnChange в вашем Formik / withFormik компоненте.

Вы также можете передать асинхронный c уровень проверки уровня поля, как вы можете видеть в документы .

...