title: Give Formik Initial Error Values, Before Validation is Called
body: <p>I have the following Form:</p>
  <pre class="lang-js prettyprint-override"><code>const MyForm = () =&gt; {
      return (
          &lt;&gt;
              &lt;Formik
                  validateOnChange={true}
                  initialValues={{ plan: &quot;&quot;, email: &quot;&quot;, name: &quot;&quot; }}
                  validate={values =&gt; {
                      console.log(values)
                      const errors = {}
                      if (values.plan !== &quot;123&quot; &amp;&amp; values.plan !== &quot;456&quot;) {
                          errors.plan = &quot;Not valid&quot;
                      } else if (values.plan === &quot;&quot;) {
                          errors.plan = &quot;Please enter something&quot;
                      }
                      if (!values.email) {
                          errors.email = &quot;Please provide an e-mail address.&quot;
                      } else if (
                          !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i.test(values.email)
                      ) {
                          errors.email = &quot;Please provide a valid e-mail address.&quot;
                      }
                      return errors
                  }}
                  onSubmit={(values, { setSubmitting }) =&gt; {
                      setTimeout(() =&gt; {
                          setSubmitting(false)
                      }, 400)
                  }}
              &gt;
                  {({ isSubmitting, errors }) =&gt; (
                      &lt;Form&gt;
                          &lt;FieldWrapper&gt;
                              &lt;InputField type=&quot;text&quot; name=&quot;plan&quot; label=&quot;plan&quot; /&gt;
                              &lt;StyledErrorMessage name=&quot;plan&quot; component=&quot;div&quot; /&gt;
                          &lt;/FieldWrapper&gt;
                          &lt;Button
                              disabled={errors.plan}
                          &gt;
                              Continue
              &lt;/Button&gt;
                      &lt;/Form&gt;
                  )}
              &lt;/Formik&gt;
          &lt;/&gt;
      )
  }
  
  </code></pre>
  <p>I have a <code>Continue</code> Button and I want it to be disabled if there are any errors. I am doing <code>&lt;Button disabled={errors.plan}&gt;</code> and this works.</p>
  <p>However: it does not disable to Button <em>when the user just doesn't touch the field at all</em> - since then, the validation isn't called and consequently, there won't be any errors in the error object. So initially, the button is not disabled.</p>
  <p>How can I circumvent this?</p>