diff --git a/.changeset/red-walls-press.md b/.changeset/red-walls-press.md new file mode 100644 index 000000000..c2ec0c169 --- /dev/null +++ b/.changeset/red-walls-press.md @@ -0,0 +1,5 @@ +--- +'formik': patch +--- + +Fixed validation on stale values diff --git a/packages/formik/src/Formik.tsx b/packages/formik/src/Formik.tsx index 80d868665..79dc43afe 100755 --- a/packages/formik/src/Formik.tsx +++ b/packages/formik/src/Formik.tsx @@ -418,7 +418,12 @@ export function useFormik({ dispatchFn(); } }, - [props.initialErrors, props.initialStatus, props.initialTouched, props.onReset] + [ + props.initialErrors, + props.initialStatus, + props.initialTouched, + props.onReset, + ] ); React.useEffect(() => { @@ -549,7 +554,7 @@ export function useFormik({ const willValidate = shouldValidate === undefined ? validateOnBlur : shouldValidate; return willValidate - ? validateFormWithHighPriority(state.values) + ? validateFormWithHighPriority(stateRef.current.values) : Promise.resolve(); } ); @@ -560,7 +565,9 @@ export function useFormik({ const setValues = useEventCallback( (values: React.SetStateAction, shouldValidate?: boolean) => { - const resolvedValues = isFunction(values) ? values(state.values) : values; + const resolvedValues = isFunction(values) + ? values(stateRef.current.values) + : values; dispatch({ type: 'SET_VALUES', payload: resolvedValues }); const willValidate = @@ -593,7 +600,9 @@ export function useFormik({ const willValidate = shouldValidate === undefined ? validateOnChange : shouldValidate; return willValidate - ? validateFormWithHighPriority(setIn(state.values, field, value)) + ? validateFormWithHighPriority( + setIn(stateRef.current.values, field, value) + ) : Promise.resolve(); } ); @@ -678,7 +687,7 @@ export function useFormik({ const willValidate = shouldValidate === undefined ? validateOnBlur : shouldValidate; return willValidate - ? validateFormWithHighPriority(state.values) + ? validateFormWithHighPriority(stateRef.current.values) : Promise.resolve(); } );