Условная проверка с Yup и Formik - PullRequest
Новая
       6

Условная проверка с Yup и Formik

0 голосов
/ 28 февраля 2019

Вот моя схема проверки: 

const validationSchema = Yup.object().shape({
      person: Yup.object().shape({
        name: Yup.string().required('Field is required'),
        surname: Yup.string().required('Field is required'),
        middleName: Yup.string().required('Field is required'),
        email: Yup.string()
          .email('Wrong e-mail format')
          .required('Field is required')
      }),
      company: Yup.object().shape({
        name: Yup.string().required('Field is required'),
        address: Yup.string().required('Field is required'),
        email: Yup.string()
          .email('Wrong e-mail format')
          .required('Field is required')
      })
    });

А также в React State есть две переменные: isPerson и isCompany.Как заставить проверку работать условно, например, если isPerson имеет значение true, тогда person в validationSchema требуется для проверки?

Ответы [ 2 ]

0 голосов
/ 20 мая 2019

Вы можете использовать условия Yup 

const validationSchema = Yup.object().shape({

      isCompany: Yup.boolean(),
      companyName: Yup.object().when('isCompany', {
        is: true,
        then: Yup.string().required('Field is required'),
        otherwise: Yup.string()
      }),
      companyAddress: Yup.object().when('isCompany', {
        is: (companyValue) => true,//just an e.g. you can return a function
        then: Yup.string().required('Field is required'),
        otherwise: Yup.string()
      }),
    });

И не забудьте соответствующим образом обновить свою форму.Я надеюсь, что вы поняли ...

0 голосов
/ 28 февраля 2019

Вы можете условно добавить в свою схему проверки, как и любой другой объект: 

let validationShape = {
  company: Yup.object().shape({
    name: Yup.string().required('Field is required'),
    address: Yup.string().required('Field is required'),
    email: Yup.string()
      .email('Wrong e-mail format')
      .required('Field is required')
  })
};

if (this.state.isPerson) {
  validationShape.person = Yup.object().shape({
    name: Yup.string().required('Field is required'),
    surname: Yup.string().required('Field is required'),
    middleName: Yup.string().required('Field is required'),
    email: Yup.string()
      .email('Wrong e-mail format')
      .required('Field is required');
}

const validationSchema = Yup.object().shape(validationShape);
...