Как я могу проверить объект внутри объектов в YUP? - PullRequest
Новая
       4

Как я могу проверить объект внутри объектов в YUP?

0 голосов
/ 03 марта 2020

Я использую formik с yup для обработки моих форм, и мне нужно проверить два объекта, которые установлены formik в начальных значениях: 

initialValues: {
  company: { company_name: '', cnpj: '', fantasy_name: '', state_registration: '' },
  user: { email: '', password: '' }
},
validationSchema: schema,

Так что это моя схема проверки yup: 

  const schema = Yup.object().shape({
    company_name: Yup.string().required('Informe o nome da filial!'),
    cnpj: Yup.string().required('Informe o cnpj!'),
    email: Yup.string().email('Email não possui formato válido').required('Informe o e-mail'),
    password: Yup.string().required('Informe a senha')
  })

Как я могу поставить еще один уровень (пользователь / компания)? Я пытался что-то вроде: 

company.company_name: Yup.string().required('Informe o nome da filial!')

Но я получаю:

Ошибка синтаксического анализа: неожиданный токен, ожидается ","

Как я могу сделать это?

Я также пытался: 

  const schema = Yup.object().shape({
    company: Yup.object().shape({
      company_name: Yup.string().required('Informe o nome da filial!'),
      cnpj: Yup.string().required('Informe o cnpj!'),
    }),
    user: Yup.object().shape({
      email: Yup.string().email('Email não possui formato válido').required('Informe o e-mail'),
      password: Yup.string().required('Informe a senha')
    })
  })

Но я получаю:

Ошибка типа: не удается прочитать свойство 'company_name' из неопределенного

Мой компонент шаблона: 

<TextField
          value={formik.values.company.company_name}
          onChange={formik.handleChange}
          onBlur={formik.handleBlur} 
          helperText={formik.touched.company.company_name ? formik.errors.company.company_name : ""}
          error={formik.touched.company && Boolean(formik.errors.company)}
          variant="outlined"
          margin="normal"
          required
          fullWidth
          id="company_name"
          label="Razão social"
          name="company_name"
        />

1 Ответ

2 голосов
/ 03 марта 2020

Я думаю, что вы можете продолжать вложить это так: 

const schema = Yup.object().shape({
  company: Yup.object().shape({
    company_name: Yup.string.required(),
    // etc
  }),
  user: Yup.object().shape({
    email: Yup.string.required(),
    password: Yup.string.required(),
  }),
});

Вы получили эту ошибку, потому что company.company_name не является допустимым ключом. Если вы хотите сделать что-то подобное, вам придется использовать вычисляемый ключ:

['company.company_name']: 'Company Name'

...