Formik Loses Focus With React

Custom field component loses focus when typing a single character

Question

When isValidating worked in Formik callback, the input loses focus when typing a single character.


_13<Formik initialValues={initialValues} onSubmit={onSubmit}>
_13  {({ isSubmitting, handleSubmit, submitForm, isValidating }) => {
_13    const disabled = isSubmitting || isValidating
_13
_13    return (
_13      <Form onBlur={onFormBlur} onSubmit={handleSubmit} onKeyDown={onFormKeyDown}>
_13        <InputGroup>
_13          <InputField type="text" name="name" disabled={disabled} />
_13        </InputGroup>
_13      </Form>
_13    )
_13  }}
_13</Formik>

Resolve

Removed isValidating
Use formikRef

_12const formikRef = useRef<FormikProps<typeof initialValues>>(null); _12const isValidating = formikRef.current?.isValidating; _12 _12<Formik _12 innerRef={formikRef} _12 initialValues={initialValues} _12 onSubmit={onSubmit} _12> _12 {() => { _12 ...isValidating _12 }} _12</Formik>