title: yup with react-hook-form skips characters on error
body: <p>I am trying to validate forms using yup, react-hook-form and @hookform. Validations seems to be working fine but there is an issue. Whenever there is an error, input skips a character.</p>
  <p>For example on error, if it says it's min 3 characters and it's required, I enter a character and it doesn't register it. I need to press twice. Then when I enter a character, the error is now only min 3 characters and it skips a character again. So whenever error changes, it doesn't register my first key press.</p>
  <p>I cleared all the styles and it still does it.</p>
  <p>My handle change function is here:</p>
  <pre><code>function handleChange(event) {
      const { name, value } = event.target;
      setFormValue((prevState) =&gt; ({ ...prevState, [name]: value }));
  }
  </code></pre>
  <p>Any idea what is the cause?</p>