如何在Typescript中使用useFormik()？

npm install formik react react-dom

import { useFormik } from 'formik';
import { FormikValues } from 'formik/dist/types';

interface MyFormValues {
  name: string;
  email: string;
  password: string;
}

const initialValues: MyFormValues = {
  name: '',
  email: '',
  password: '',
};

const validate = (values: MyFormValues) => {
  const errors: Partial<MyFormValues> = {};

  // 在这里添加你的验证逻辑

  return errors;
};

const MyForm = () => {
  const formik = useFormik<MyFormValues>({
    initialValues,
    validate,
    onSubmit: (values) => {
      // 在这里处理表单提交的逻辑
      console.log(values);
    },
  });

  return (
    <form onSubmit={formik.handleSubmit}>
      {/* 在这里添加表单的输入字段 */}
    </form>
  );
};

const MyForm = () => {
  const formik = useFormik<MyFormValues>({
    initialValues,
    validate,
    onSubmit: (values) => {
      console.log(values);
    },
  });

  return (
    <form onSubmit={formik.handleSubmit}>
      <input
        type="text"
        name="name"
        {...formik.getFieldProps('name')}
      />
      <input
        type="email"
        name="email"
        {...formik.getFieldProps('email')}
      />
      <input
        type="password"
        name="password"
        {...formik.getFieldProps('password')}
      />
      <button type="submit">提交</button>
    </form>
  );
};