我有一个注册授权和验证表单。我需要使我的表单在我的按钮点击事件可用。起初我添加了resetform函数，以注意我的表单实际上是如何工作的，但每次点击后什么也没有发生。

import { Button, TextField } from "@mui/material";
import * as yup from "yup";
import { Formik } from "formik";

export const RegistrationForm = () => {
  const validationSchema = yup.object().shape({
    name: yup
      .string()
      .typeError("Должно быть строкой")
      .required("Обязательно")
      .matches(/^[аА-яЯ\s]+$/, "Имя должно состоять из русских букв"),
    secondName: yup
      .string()
      .typeError("Должно быть строкой")
      .required("Обязательно")
      .matches(/^[аА-яЯ\s]+$/, "Фамилия должна состоять из русских букв"),
    login: yup
      .string()
      .typeError("Должно быть строкой")
      .required("Обязательно"),
    password: yup
      .string()
      .typeError("Должно быть строкой")
      .required("Обязательно"),
    confirmPassword: yup
      .string()
      .oneOf([yup.ref("password")], "Пароли не совпадают")
      .required("Обязательно"),
    email: yup.string().email("Введите верный email").required("Обязательно"),
    confirmEmail: yup
      .string()
      .email("Введите верный email")
      .oneOf([yup.ref("email")], "Email не совпадают")
      .required("Обязательно"),
  });

  return (
    <>
      <header>
        <div className="head-btns">
          <Button variant="outlined">Зарегистрироваться</Button>
          <Button variant="outlined">Авторизоваться</Button>
        </div>
      </header>
      <Formik
        initialValues={{
          name: "",
          secondName: "",
          login: "",
          password: "",
          confirmPassword: "",
          email: "",
          confirmEmail: "",
        }}
        validateOnBlur
        onSubmit={({ resetForm }) => resetForm()}
        validationSchema={validationSchema}
      >
        {({
          values,
          errors,
          touched,
          handleChange,
          handleBlur,
          handleSubmit,
          isValid,
          dirty,
        }) => (
          <div className="register">
            <TextField
              id="outlined-basic"
              label="Имя"
              variant="outlined"
              className="field"
              name={"name"}
              onChange={handleChange}
              onBlur={handleBlur}
              value={values.name}
            />
            {touched.name && errors.name && (
              <p className={"error"}>{errors.name}</p>
            )}
            <TextField
              id="outlined-basic"
              label="Фамилия"
              variant="outlined"
              className="field"
              name={"secondName"}
              onChange={handleChange}
              onBlur={handleBlur}
              value={values.secondName}
            />
            {touched.secondName && errors.secondName && (
              <p className={"error"}>{errors.secondName}</p>
            )}
            <TextField
              id="outlined-basic"
              label="Логин"
              variant="outlined"
              className="field"
              name={"login"}
              onChange={handleChange}
              onBlur={handleBlur}
              value={values.login}
            />
            {touched.login && errors.login && (
              <p className={"error"}>{errors.login}</p>
            )}
            <TextField
              type="password"
              id="outlined-basic"
              label="Пароль"
              variant="outlined"
              className="field"
              name={"password"}
              onChange={handleChange}
              onBlur={handleBlur}
              value={values.password}
            />
            {touched.password && errors.password && (
              <p className={"error"}>{errors.password}</p>
            )}
            <TextField
              type="password"
              id="outlined-basic"
              label="Подтвердите пароль"
              variant="outlined"
              className="field"
              name={"confirmPassword"}
              onChange={handleChange}
              onBlur={handleBlur}
              value={values.confirmPassword}
            />
            {touched.confirmPassword && errors.confirmPassword && (
              <p className={"error"}>{errors.confirmPassword}</p>
            )}
            <TextField
              id="outlined-basic"
              label="Email"
              variant="outlined"
              className="field"
              name={"email"}
              onChange={handleChange}
              onBlur={handleBlur}
              value={values.email}
            />
            {touched.email && errors.email && (
              <p className={"error"}>{errors.email}</p>
            )}
            <TextField
              id="outlined-basic"
              label="Подтвердите Email"
              variant="outlined"
              className="field"
              name={"confirmEmail"}
              onChange={handleChange}
              onBlur={handleBlur}
              value={values.confirmEmail}
            />
            {touched.confirmEmail && errors.confirmEmail && (
              <p className={"error"}>{errors.confirmEmail}</p>
            )}
            <Button
              onClick={handleSubmit}
              disabled={!isValid || !dirty}
              type="submit"
              variant="contained"
              className="btn"
            >
              Зарегистрироваться
            </Button>
          </div>
        )}
      </Formik>
    </>
  );
};

我单击了按钮，但没有任何React，但它应该重置此操作后的所有输入