Как проверить реквизиты, переданные анонимному компоненту в Formik? - PullRequest
0 голосов
/ 16 апреля 2019
<Formik
        initialValues={{
          specialist: '',
        }}
        onSubmit={(values, { setSubmitting }) => {
          alert(JSON.stringify(values));
          // setSubmitting(true);
        }}
        validationSchema={createAppointmentSchema}
      >
        {props => {
          const {
            values,
            errors,
            isSubmitting,
            handleChange,
            handleSubmit,
            setFieldValue
          } = props;
          return (
            <Form onSubmit={handleSubmit}>
              <FormItem>
                <Span>Seleccione un Especialista</Span>
              </FormItem>
            ....
            </Form>
           );
         }
       }
</Formik>

В настройках выдается ошибка, когда реквизиты не проверены в моем файле .eslintrc.Но когда мы используем Formik, так как он использует шаблон render-props, так что он вызывает мой компонент как дочерний и передает ему реквизиты.У меня вопрос, как проверить реквизиты, которые Formik передал моему компоненту?

  151:13  error    'values' is missing in props validation          react/prop-types
  152:13  error    'errors' is missing in props validation          react/prop-types
  153:13  error    'isSubmitting' is missing in props validation    react/prop-types
  154:13  error    'handleChange' is missing in props validation    react/prop-types
  155:13  error    'handleSubmit' is missing in props validation    react/prop-types
  156:13  error    'setFieldValue' is missing in props validation   react/prop-types

1 Ответ

1 голос
/ 18 апреля 2019

Документация вводит в заблуждение, я сделал ту же "ошибку". Это не реквизит в общем смысле реквизита React, поэтому ваш линтер запутался. Вы можете назвать это как угодно, это объект, переданный в функцию. Я бы, наверное, просто деконструировал нужные вам переменные. Так что-то вроде:

    <Formik
      initialValues={{ specialist: '' }}
      onSubmit={(values, { setSubmitting }) => {
        alert(JSON.stringify(values));
        // setSubmitting(true);
      }}
      validationSchema={createAppointmentSchema}
    >
      {({ values, handleSubmit }) => {
        <Form onSubmit={handleSubmit}>
          <FormItem>
            <Span>Seleccione un Especialista</Span>
          </FormItem>
          ....
        </Form>;
      }}
    </Formik>
...