HandleReset throwing error in formik while using it with react

Question

I have a form, each time I click on the submit button, it throws this error: "Cannot read property 'handleReset' of undefined". Here are my codes.

 import React, { Component } from "react"; import { withFormik, Form, Field, ErrorMessage } from "formik"; import * as Yup from "yup"; class MyForm extends Component { state = { myDetails: [ { name: "name", type: "text", placeholder: "enter your name" }, { name: "email", type: "email", placeholder: "enter your email" }, { name: "password", type: "password", placeholder: "enter your password" }, { name: "dept", type: "text", placeholder: "enter your department" } ] }; render() { return ( <React.Fragment> <Form> {this.state.myDetails.map((detail, i) => ( <div key={i}> <Field name={detail.name} type={detail.type} placeholder={detail.placeholder} /> <ErrorMessage name={detail.name} /> </div> ))} <button type="submit">Submit form</button> </Form> </React.Fragment> ); } } const myFormik = withFormik({ mapPropsToValues({ name, email, password }) { return { name: "", email: "", password: "" }; }, validationSchema: Yup.object().shape({ name: Yup.string().required(), email: Yup.string() .email() .required(), password: Yup.string().required() }), handleSubmit: values => { console.log(values); } })(MyForm); export default MyForm;

How do I resolve it. I have been battling with this but cannot find an answer to it.

Answer 1

我已经看到了这个错误，我应该导出作为包装器的“MyFormik”，但我导出了“MyForm”。