How to format value of input for the onBlur event in Formik?

Viewed 4644

Using Formik, how do I change the value of the input when the onBlur event occurs?

I have a Formik form with an input for phone number, and I want to format the phone number when the input blurs.

1 Answers

This solved it for me:

<Formik
  render={props => (
    <Form>
      <Field
        name="phone"
        component={CustomInputComponent}
        onBlur={event => {
          const formatted = formatPhoneNumber(props.values['phone']);
          props.setFieldValue('phone', formatted);
          props.handleBlur(event);
        }}
      />
    </Form>
  )}
/>
Related