title: How to send form data with react-hook-form?
body: <p>I am using react-hook-form for the first time.I am trying to send the data back to my server but whenever I hit submit,I am unable to send data in first try.But if I submit again,the values are submitted successfully to my server.</p>
  <p>&lt;-- Here is my code --&gt;</p>
  <pre><code>const RegisterUser = () =&gt; {
    const [formData, setFormData] = useState({
      firstname: &quot;&quot;,
      lastname: &quot;&quot;,
      email: &quot;&quot;,
      password: &quot;&quot;,
      phoneNo: &quot;&quot;,
    });
    const schema = yup.object().shape({
      firstname: yup.string().required(&quot;First name is required&quot;),
      lastname: yup.string().required(&quot;Last name is required&quot;),
      email: yup.string().required(&quot;Email is required&quot;),
      password: yup.string().required(&quot;Password is required&quot;),
    });
    const { register, handleSubmit, errors } = useForm({
      mode: &quot;onBlur&quot;,
      resolver: yupResolver(schema),
    });
  const {email, password} = formData;
    const handleFormSubmit = async (data) =&gt; {
      setFormData({
        email: data.email,
        password: data.password
      });
  const newUser = { email, password};
      try {
        const config = {
          headers: {
            &quot;Content-Type&quot;: &quot;application/json&quot;,
          },
        };
        const body = JSON.stringify(newUser);
        await axios.post(`http://localhost:5000/users`, body, config);
      } catch (err) {
        console.log(err);
      }
      // }
    };
  
    return (
      &lt;Container&gt;
        &lt;Form onSubmit={handleSubmit(handleFormSubmit)}&gt;
          &lt;Input
            type=&quot;email&quot;
            label=&quot;Email&quot;
            name=&quot;email&quot;
            ref={register}
            error={!!errors.email}
            helperText={errors?.email?.message}
          /&gt;
  
          &lt;Input
            type=&quot;password&quot;
            label=&quot;Password&quot;
            name=&quot;password&quot;
            ref={register}
            error={!!errors.password}
            helperText={errors?.password?.message}
          /&gt;
          &lt;Button type=&quot;submit&quot; className=&quot;btn btn-primary&quot;&gt;
            Submit
          &lt;/Button&gt;
        &lt;/Form&gt;
  </code></pre>