Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6214

erase formik error after submitting a form

$
0
0

When I enter the screen, there's no error displayed on the input field. In my Formik form, I take an input and run a graphql mutation on it. Once it's done, I reset the form. However, after resetting, I start seeing a Formik Error because the field is .required() and currently it's empty.

This error should only be shown when I am trying to submit the form without an input. It shouldn't show after I have submitted it successfully.

  const handleSubmitForm = (    values: FormValues,    helpers: FormikHelpers<FormValues>,  ) => {    editLocationName({      variables: {      favouritePlaceId: route.params.id,      input: {customisedName: values.locationName}      },    });    helpers.resetForm();    helpers.setErrors({});  };.....<Formik            initialValues={initialValues}            onSubmit={handleSubmitForm}            validationSchema={validationSchema}>            {({ handleChange, handleBlur, handleSubmit, values }) => (<View style={styles.searchFieldContainer}><View style={styles.form}><FieldInput                    handleChange={handleChange}                    handleBlur={handleBlur}                    value={values.locationName}                    fieldType="locationName"                    placeholderText="Neuer Name"                  /><ErrorMessage                    name="locationName"                    render={(msg) => <ErrorText errorMessage={msg} />}                  /></View><View style={styles.buttonContainer}><ActionButton buttonText="Save" onPress={handleSubmit} /></View></View>            )}</Formik>

Validation Schema:

const favouriteLocationNameValidationSchema = yup.object().shape({  locationName: yup  .string()  .label('locationName')  .required('Required Field')  .max(70, 'Too Long!')  .min(3, 'Too Short!'),});

How can I erase/reset the error along with the form?

setErrors is not making any difference here.


Viewing all articles
Browse latest Browse all 6214

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>