объект ошибки возвращает неопределенное в formik с yup - PullRequest
Новая
       12

объект ошибки возвращает неопределенное в formik с yup

1 голос
/ 22 июня 2019

Я пытаюсь заставить форму реагировать с Formik и Yup (для проверки).Я сделал форму объекта yup, установил начальные значения formik, но проверка все еще не работает.ошибки formik возвращают реквизиты undefined. 

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 Но, похоже, что некоторые люди также решили эту проблему.Любая помощь здесь?

...