JAVASCRIPT

formik clear field

import { Formik, Field, Form, ErrorMessage } from 'formik';
import * as Yup from 'yup';

const LoginForm = (props) => {
    return (
        <>
            <h1>LoginForm</h1>
            <Formik
                initialValues={{ email: '', password: ''}}
                validationSchema={Yup.object({
                    email: Yup.string()
                        .max(40, 'Must be 40 characters or less')
                        .required('Required'),
                    password: Yup.string()
                        .max(20, 'Must be 20 characters or less')
                        .required('Required'),
                })}
                // resetForm to clear formik fields after submit
                onSubmit={(values, { resetForm }) => {
                    console.log(values)
                    resetForm({values: ''})
                }}>
                <Form>
                    <div>
                        <label htmlFor="email">Email</label>
                        <Field name="email" type="text" />
                        <ErrorMessage name="email" />
                    </div>
                    <div>
                        <label htmlFor="password">Password</label>
                        <Field name="password" type="text" />
                        <ErrorMessage name="password" />
                    </div>
                    <button type="submit">Submit</button>
                </Form>
            </Formik>
        </>

    );
};