错误对象使用yup在formik中返回undefined

Question

我正在尝试制作一个与Formik和Yup反应的表单（用于验证）。我已经完成了yup对象的形状，将初始值设置为formik，但是仍然无法进行验证。 Formik的错误道具返回未定义。

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

const schema = Yup.object().shape({
  email: Yup.string()
    .label("Email")
    .required("Enter a valid email")
    .email()
});

class OneForm extends React.Component {
  state = {
    email: ""
  };

  render() {
    return (
      <>
        <Formik
          initialValues={{
            email: ""
          }}
          onSubmit={(values, actions) => {
            console.log(values);
            this.setState({
              email: values.email
            });
            setTimeout(() => {
              actions.setSubmitting(false);
              actions.resetForm();
            }, 1000);
          }}
          validationSchema={schema}
        >
          {props => {
            return (
              <Form>
                {console.log(props.errors)}

                <Field
                  type="email"
                  placeholder="Email"
                  name="email"
                  onChange={props.handleChange}
                />

                {props.errors.email && <p>{props.errors.email}</p>}
                <br />
                <button
                  disabled={props.isSubmitting}
                  type="submit"
                  onClick={props.handleSubmit}
                >
                  Submit
                </button>
              </Form>
            );
          }}
        </Formik>
      </>
    );
  }
}

export default OneForm;

有人可以在这里帮助我吗？似乎他们对此有一个积极的问题：https://github.com/jaredpalmer/formik/issues/1180 但是，似乎有些人也解决了这个问题。这里有帮助吗？