title: How to change Yup validation conditionally in ReactJs
body: <p>Hi all I have following code: <a href="https://codesandbox.io/s/material-demo-forked-gcqf5" rel="nofollow noreferrer">my code</a></p>
  <p>I have two custom inputs components first one is common input second one checkbox:</p>
  <pre><code>      const MyTextInput = ({ label, ...props }) =&gt; {
          const [field, meta] = useField(props);
          return (
            &lt;&gt;
              &lt;label htmlFor={props.id || props.name}&gt;
                {label} &lt;span&gt;*&lt;/span&gt;
              &lt;/label&gt;
              &lt;div&gt;
                &lt;input {...field} {...props} /&gt;
              &lt;/div&gt;
              {meta.touched &amp;&amp; meta.error ? &lt;div&gt;{meta.error}&lt;/div&gt; : null}
            &lt;/&gt;
          );
        };
  
  
  
      const MyCheckbox = ({ children, ...props }) =&gt; {
          const [field, meta] = useField({ ...props, type: &quot;checkbox&quot; });
          return (
            &lt;div&gt;
              &lt;label&gt;
                &lt;input type=&quot;checkbox&quot; {...field} {...props} /&gt;
                &lt;span&gt; {children}&lt;/span&gt;
              &lt;/label&gt;
              {meta.touched &amp;&amp; meta.error ? (
                &lt;div&gt;{meta.error}&lt;/div&gt;
              ) : null}
            &lt;/div&gt;
          );
        };
  
  </code></pre>
  <p>I am using that components to create inputs for my form:</p>
  <pre><code>          &lt;MyTextInput
              label=&quot;validity&quot;
              name=&quot;validity&quot;
              type=&quot;date&quot;
              disabled={a}
            /&gt;
  
            &lt;MyCheckbox name=&quot;withoutLimitations&quot; onClick={checkMe}&gt;
              without Limitation
            &lt;/MyCheckbox&gt;
  
  
            &lt;MyTextInput
              label=&quot;number Of Uses &quot;
              name=&quot;numberOfUses&quot;
              type=&quot;text&quot;
              disabled={b}
            /&gt;
            &lt;MyCheckbox name=&quot;withoutLimitations_1&quot; onClick={checkMe1}&gt;
              without Limitation
            &lt;/MyCheckbox&gt;
  </code></pre>
  <p>Also I am using Yup for creating validation:</p>
  <pre><code>       validationSchema={Yup.object({
            validity: Yup.date().required(),
            numberOfUses: Yup.number().required()
          })}
  </code></pre>
  <p>Now my question is how can I change my validation schema when I am checking one of checkboxes.</p>
  <p>For example if I am checking first checkbox that mean that date form should become disabled and value should become null no meter what user choose before checking the checkbox.</p>
  <p>with useState I able conditionally enable or disable the inputs but can't change validation schema, because when input don't have any data then I am pressing on submit button there was nothing happen.</p>
  <p>Please help me to resolve this problem</p>