У меня есть компонент Formik

{amp}lt;Formik initialValues={initialValues} enableReinitialize onSubmit={(values, { setSubmitting, setErrors }) ={amp}gt; { handleSubmitForm(values, id); setSubmitting(false); }} {amp}gt; 

И мне нужно обработать валидацию из API, но мои действия с запросами и ошибками отличаются, поэтому мне нужно использовать useEffect для обработки ошибок. Как я могу использовать метод setErrors моего Formik вне onSubmit или в useEffect следующим образом:

 useEffect(() ={amp}gt; { setErrors({...error}) }, [error]) 

Я решил проблему следующим образом: я добавил к своему handleSubmitForm async следующее:

 const handleSubmitForm = async (data, id) ={amp}gt; { ... } 

И не он возвращает promise , а добавил глобальную переменную let errorResolver = null; за пределами моего компонента функции, и добавил useEffect

 useEffect(() ={amp}gt; { if (!isEmpty(error)) { if (errorResolver) { errorResolver(error); } } }, [error]); 

тогда я реорганизовал мой onSubmit следующим образом:

 onSubmit={(values, { setSubmitting, setErrors }) ={amp}gt; { handleSubmitForm(values, id).then(() ={amp}gt; { new Promise(resolve ={amp}gt; { errorResolver = resolve; }).then(response ={amp}gt; { let errorObj = {}; response.map(item ={amp}gt; { errorObj = { ...errorObj, ...item }; }); setErrors(errorObj); }); }); setSubmitting(false); }} 

Так что теперь, когда я делаю onSubmit, он будет ждать, пока объект ошибки получит значение. Конечные компоненты выглядят так:

 import React, { useEffect } from 'react'; import { isEmpty } from 'lodash'; import { Form, Formik } from 'formik'; let errorResolver = null; export default function TableDataManager({ error, handleSubmitForm }) { useEffect(() ={amp}gt; { if (!isEmpty(error)) { if (errorResolver) { errorResolver(error); } } }, [error]); return ( {amp}lt;Formik onSubmit={(values, { setSubmitting, setErrors }) ={amp}gt; { handleSubmitForm(values, id).then(() ={amp}gt; { new Promise(resolve ={amp}gt; { errorResolver = resolve; }).then(response ={amp}gt; { let errorObj = {}; // eslint-disable-next-line array-callback-return response.map(item ={amp}gt; { errorObj = { ...errorObj, ...item }; }); setErrors(errorObj); }); }); setSubmitting(false); }} {amp}gt; ... {amp}lt;/Formik{amp}gt; ) } 

Не уверен, что лучшее решение, но оно работает.