尝试创建带验证的Formik多步。如何验证字段？

npm install formik yup

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

const validationSchema = Yup.object().shape({
  firstName: Yup.string().required('First Name is required'),
  lastName: Yup.string().required('Last Name is required'),
  email: Yup.string().email('Invalid email').required('Email is required'),
  password: Yup.string().required('Password is required'),
});

const Step1 = () => (
  <div>
    <h2>Step 1</h2>
    <Field type="text" name="firstName" placeholder="First Name" />
    <ErrorMessage name="firstName" component="div" />
    <Field type="text" name="lastName" placeholder="Last Name" />
    <ErrorMessage name="lastName" component="div" />
  </div>
);

const Step2 = () => (
  <div>
    <h2>Step 2</h2>
    <Field type="email" name="email" placeholder="Email" />
    <ErrorMessage name="email" component="div" />
    <Field type="password" name="password" placeholder="Password" />
    <ErrorMessage name="password" component="div" />
  </div>
);

const MultiStepForm = () => {
  const handleSubmit = (values) => {
    // 处理表单提交逻辑
    console.log(values);
  };

  return (
    <Formik
      initialValues={{
        firstName: '',
        lastName: '',
        email: '',
        password: '',
      }}
      validationSchema={validationSchema}
      onSubmit={handleSubmit}
    >
      {({ values }) => (
        <Form>
          {values.step === 1 && <Step1 />}
          {values.step === 2 && <Step2 />}
          <button
            type="button"
            onClick={() => {
              values.step > 1 && setFieldValue('step', values.step - 1);
            }}
          >
            Previous
          </button>
          <button
            type="button"
            onClick={() => {
              values.step < 2 && setFieldValue('step', values.step + 1);
            }}
          >
            Next
          </button>
          {values.step === 2 && (
            <button type="submit">Submit</button>
          )}
        </Form>
      )}
    </Formik>
  );
};