title: Dropdown and value not updating in Formik + React Form
body: <p>Following are the problems I am facing with my code -</p>
  
  <ol>
  <li>Commodity Dropdown is initialised incorrectly - I am expecting <code>commodity 2</code> to be available on load time but it is taking <code>commodity 1</code> <strong>RESOVLED</strong> <code>initialValue={values.commodity.value}</code> should be there in commodity Select.</li>
  <li>On change of commodity from commodity dropdown, plant dropdown is not updating at all. [<strong>STILL PENDING</strong>]</li>
  </ol>
  
  <p>Working Example - <a href="https://codesandbox.io/s/ql95jvpxq4" rel="nofollow noreferrer">https://codesandbox.io/s/ql95jvpxq4</a> (correct behaviour)</p>
  
  <p>I tried to replicate the same with my <code>Select</code> but somehow its not working. Let me know what I am doing wrong here.</p>
  
  <p><strong>Faulty code</strong> - <a href="https://codesandbox.io/s/01qno3vmvl" rel="nofollow noreferrer">https://codesandbox.io/s/01qno3vmvl</a></p>
  
  <p>Code -</p>
  
  <pre><code>const formikEnhancer = withFormik({
    mapPropsToValues: props =&gt; ({
      commodity: { value: "commodity2", label: "commodity2" },
      plant: { value: "Plant3", label: "Plant3" }
    }),
    handleSubmit: (values, { setSubmitting }) =&gt; {
      const payload = {
        ...values,
        commodity: values.commodity.value,
        plant: values.plant.value
      };
      setTimeout(() =&gt; {
        alert(JSON.stringify(payload, null, 2));
        setSubmitting(false);
      }, 1000);
    },
    displayName: "MyForm"
  });
  </code></pre>
  
  <p>Form -</p>
  
  <pre><code>&lt;form onSubmit={handleSubmit}&gt;
          &lt;div style={{ margin: "1rem 0" }}&gt;
            &lt;label htmlFor="commodity" style={{ display: "block" }}&gt;
              Commodity
            &lt;/label&gt;
            &lt;Select
              id="commodity"
              name="commodity"
              value={commodities}
              initialValue={values.commodity}
              onChange={(field, value) =&gt; {
                console.log(value);
                setFieldValue("plant", plants[value][0]);
              }}
            /&gt;
          &lt;/div&gt;
          &lt;div style={{ margin: "1rem 0" }}&gt;
            &lt;label htmlFor="plant" style={{ display: "block" }}&gt;
              Plant
            &lt;/label&gt;
            &lt;Select
              id="plant"
              name="plant"
              value={plants[values.commodity.value]}
              onChange={setFieldValue}
            /&gt;
          &lt;/div&gt;
  
          &lt;button
            type="button"
            className="outline"
            onClick={handleReset}
            disabled={!dirty || isSubmitting}
          &gt;
            Reset
          &lt;/button&gt;
          &lt;button type="submit" disabled={isSubmitting}&gt;
            Submit
          &lt;/button&gt;
  
          &lt;DisplayFormikState {...this.props} /&gt;
        &lt;/form&gt;
  </code></pre>
  
  <p>FYI - I am new to <code>formik</code> so may be I am missing something very common here.</p>