Как написать пользовательскую проверку схемы, используя yup.addMethod () для названия страны и кода - PullRequest
Новая
       11

Как написать пользовательскую проверку схемы, используя yup.addMethod () для названия страны и кода

1 голос
/ 04 марта 2020

Я пытаюсь добавить проверки формы, используя yup, к компоненту формы React, используя formik. Кажется, моя проверка работает, но я считаю ее слишком многословной.

Попытка использовать функцию .addMethod() для yup, но зацикливание на синтаксисе или, может быть, это перебор?

Резюме: я хотел бы преобразовать свою проверку в фактическую метод с использованием yup.addMethod().

Фактическая проверка: 

import * as yup from 'yup'

const countryNameRegex = /[A-Za-z]/g;
const countryCodeRegex = /[a-zA-Z]{2,}/g;
const isRequired = 'Required Field'
const isCorrectFormat = 'The country name may contain only letters'

const countryValidationSchema = yup.object().shape({
  name: yup.string()
    .min(3, `country name must contain at least 3 characters`)
    .matches(
      countryNameRegex,
      {
        message: isCorrectFormat,
        excludeEmptyStrings: true
      }
    )
    .label(`Country Name`)
    .required(isRequired),
  code: yup.string()
    .length(2, `The country code must be exactly 2 letters`)
    .matches(
      countryCodeRegex,
      { 
        message: isCorrectFormat,
        excludeEmptyStrings: true
      }
    )
    .label('Country Code')
    .required(isRequired),
});

export default countryValidationSchema;

Мое испытание с использованием yup.addMethod()

function isValidCountryName(ref, msg) {
  return yup.mixed().test({
    name: 'isValidCountry',
    exclusive: false,
    message: msg || `${ref.path} must be a valid country name`,
    params: {
      reference: ref.path,
    },
    test(value) {
     const isRightFormat = this.resolve(ref);
     return isRightFormat; [//ASK] should be doing the checks or transformations here
    },
  });
}

yup.addMethod(yup.string, 'isValidCountryName', isValidCountryName)
...