title: How to clear react-select value after formik form submission?
body: <p>I have a formik form where I have used react-select for select list. Here is my form:</p>
  <pre><code>import React from &quot;react&quot;;
  
  import { ErrorMessage, Field, Form, Formik } from &quot;formik&quot;;
  import * as Yup from &quot;yup&quot;;
  import { Button, Col, FormGroup } from &quot;reactstrap&quot;;
  import Select from &quot;react-select&quot;;
  
  
  const AddBankForm = (props) =&gt; {
    return (
      &lt;Formik
        initialValues={{
          district: props.districts,
        }}
        validationSchema={Yup.object({
          district: Yup.string().required(&quot;Required&quot;),
        })}
        onSubmit={(values, actions) =&gt; {
      setError(null);
      setMessage(null);
      try {
        const response = await postDataWithAuth(DISTRIBUTOR_BANK_ADD, {
          routing_number: values.branch,
          bank_account_number: values.accountNumber,
          account_holder_name: values.accountName,
          pin_number: values.tpin,
        });
  
  
        // This is not working
        actions.resetForm();
  
        
        setMessage(response.message);
      } catch (e) {
        setError(e.response.data);
      }
      actions.setSubmitting(false);
    }}
      &gt;
        {(formikProps) =&gt; (
          &lt;Form onSubmit={formikProps.handleSubmit} autoComplete=&quot;one-time-code&quot;&gt;
            &lt;div className=&quot;form-row&quot;&gt;
              &lt;Col&gt;
                &lt;FormGroup&gt;
                  &lt;label&gt;
                    District&lt;span className=&quot;text-danger&quot;&gt;*&lt;/span&gt;
                  &lt;/label&gt;
                  &lt;Select
                    menuPortalTarget={document.body}
                    type=&quot;text&quot;
                    name=&quot;district&quot;
                    onChange={(option) =&gt; {
                      props.updateDistrict(option.value);
                      formikProps.setFieldValue(&quot;district&quot;, option.value);
                    }}
                    options={
                      props.isCreateLiftingSuccessful ? [] : props.districts
                    }
                    onBlur={formikProps.handleBlur}
                  /&gt;
                  &lt;ErrorMessage
                    name=&quot;district&quot;
                    component=&quot;div&quot;
                    className=&quot;text-danger&quot;
                  /&gt;
                &lt;/FormGroup&gt;
              &lt;/Col&gt;
    &lt;/div&gt;
            &lt;div className=&quot;form-row mt-3 text-center&quot;&gt;
              &lt;Col&gt;
                &lt;Button
                  className=&quot;btn btn-success&quot;
                  type=&quot;submit&quot;
                  disabled={!formikProps.dirty || formikProps.isSubmitting}
                &gt;
                  Submit
                &lt;/Button&gt;
              &lt;/Col&gt;
            &lt;/div&gt;
          &lt;/Form&gt;
        )}
      &lt;/Formik&gt;
    );
  };
  </code></pre>
  <p>The problem is that the react-select field is not getting cleared after the form submission. I have used formik's <code>resetForm()</code> method to clear my form. But it seems that resetForm method does not have any impact on the react-select field.</p>