title: ReactJs- Using Formik to write a form with axios
body: <p>I am creating a form for my website that takes in the contact information of a user. The site uses ReactJs for the client side and for the backend I am using NodeJs and ExpressJs. </p>
  
  <p>I have been using FormikJs to create the form component. In the code below I have already created the form and will pass it to a higher order component built into Formik. I have found it useful for validation with Yup as well as speedily creating the layout of the form and some basic form functions but I am having trouble with actually getting it to send a users' input to the backend. </p>
  
  <p>I am trying to use axios to send a POST request to "/send" (a route created with express) so that the backend part of my app could retrieve the contact information and use nodemailer to mail it to myself.</p>
  
  <pre><code>const FormikApp = withFormik({
  mapPropsToValues: // props being mapped to values
  },
  
  validationSchema: // Yup Validation Schema
  
  async handleSubmit(e, values, { resetForm, setErrors, setSubmitting }){
      const { name, company, phone, email, message} = this.value;
  
      const form = await axios.post("/send", {
          name,
          company,
          phone,
          email,
          message
      })
      resetForm();
      setSubmitting(false);
  
  }
  })(Forms);
  </code></pre>
  
  <p>My problem is that without "const { name, company, phone, email, message} = this.value;" an error is throwned that name, company, phone, email, and message are undefined. And with that line, everything renders fine but I am still unable to receive an email from using the form.</p>
  
  <p>I am pretty sure I have set up the package.json file for the client and server site with the help of concurrently correctly and I do believe there is a problem with the form itself. I think that the handleSubmit function with formik is to blame but I do not know how I could fix this. It could be because I am not properly defining the values or not properly declaring that handleSubmit should be an asynchronous function. Could anyone help?</p>
  
  <p>I am planning to just create the form from scratch without formik so I could have more control over the handleSubmit function and how the values are defined.</p>
  
  <p>Thank you in advance to anyone who helps! Feel free to ask for code snippets, if necessary.</p>