title: React Formik - Trigger validation only on form submit
body: <p>I am using Formik in my React Native application. On the login form I have two fields: email and password, both of them are required.</p>
  
  <p>I've written such validation rules:</p>
  
  <pre><code>export const LoginSchema = Yup.object().shape({
    email: Yup.string()
      .email('The email is invalid')
      .required('This field is required'),
    password: Yup.string()
      .min(6, 'The password is too short')
      .max(12, 'The password is too long')
      .required('This field is required'),
  });
  </code></pre>
  
  <p>I need to trigger validation ONLY on form submit and show an error popup. I've read the docs, but can't find a solution because the validation triggers onBlur. How can this be done?</p>
  
  <p>Thanks!</p>
  
  <pre><code>const Login = ({ navigation }) =&gt; {
    const [isLoading, setIsLoading] = useState(true);
    const [isVisible, setIsVisible] = useState(false);
  
    useEffect(() =&gt; {
      // Later check for token
      const tokenIsStored = true;
  
      if (tokenIsStored) {
        setIsLoading(false);
      }
    });
  
    const onLogin = values =&gt; {
      console.log(values, 'on login');
  
      // Pass value to BE endpoint
      navigation.navigate('Dashboard');
    };
  
    const onModalClose = () =&gt; {
      setIsVisible(false);
    };
  
    console.log(isVisible);
  
    if (!isLoading) {
      return (
        &lt;ScrollContainer keyboardShouldPersistTaps="handled"&gt;
          &lt;ThemedStatusBar /&gt;
  
          &lt;ThemedModal
            isVisible={isVisible}
            primaryMessage="Log In Failed"
            secondaryMessage="Please check your password"
            btnTitle="OK"
            btnPress={() =&gt; onModalClose()}
          /&gt;
  
          &lt;Formik
            initialValues={{ email: '', password: '' }}
            validationSchema={LoginSchema}
            onSubmit={values =&gt; onLogin(values)}
          &gt;
            {props =&gt; (
              &lt;View&gt;
                &lt;ScrollContainer BackgroundColor={Colors.greyColor} Padding="0px" style={styles.loginForm}&gt;
                  &lt;ThemedInput
                    onChangeText={props.handleChange('email')}
                    onBlur={props.handleBlur('email')}
                    value={props.values.email}
                    placeholder="Email"
                    keyboardType="email-address"
                  /&gt;
                  &lt;ThemedInput
                    onChangeText={props.handleChange('password')}
                    onBlur={props.handleBlur('password')}
                    value={props.values.password}
                    placeholder="Password"
                    overrideStyles={styles.loginInputBottom}
                    secureTextEntry
                  /&gt;
                  {props.errors.email &amp;&amp; setIsVisible(true)}
                &lt;/ScrollContainer&gt;
                &lt;ThemedButton onPress={props.handleSubmit} title="Log In" /&gt;
              &lt;/View&gt;
            )}
          &lt;/Formik&gt;
        &lt;/ScrollContainer&gt;
      );
    }
    return &lt;ThemedLoader isLoading /&gt;;
  };
  
  export default Login;
  </code></pre>