Estoy enviando un formulario usando Formik. Quiero tener una lógica de validación ligeramente diferente dependiendo de si se desencadena por eventos de desenfoque/cambio o validación previa al envío. (En pocas palabras, durante el envío previo, solo quiero ejecutar la validación de sincronización: mi back-end hará la misma validación asíncrona que ejecuto en el desenfoque/cambio cuando envío el formulario, por lo que quiero omitirlo en el envío previo .) Mi función de validación se parece a esto:
validate={(value) => { const error = validateSync(value); if (!error && !form.isSubmitting) { return validateAsync(value); } return error; }} En este caso, estoy usando useFormikContext para obtener form.isSubmitting .
De acuerdo con los documentos de Formik sobre el envío, isSubmitting debe establecerse en true inmediatamente en la etapa previa al envío , antes de la etapa de validación . Esto no parece estar sucediendo, como puede ver si intenta enviar el formulario en este entorno limitado (verifique la consola para ver que tanto isSubmitting como isValidating son false ; de acuerdo con los documentos de Formik, ambos deberían ser true en este escenario).
Otro usuario tenía una pregunta similar , pero la respuesta no aborda el (posible) error subyacente con Formik.
Usé el gancho useRef de React para hacer referencia a la versión actual del formulario:
const form = useFormikContext(); const formRef = useRef(); formRef.current = form; // within a delayed callback: function delayedCallback() { // pulls the current value of isSubmitting, whenever the delayedCallback fires const { isSubmitting } = formRef.current; };Funciona al 100%