1. Создание схемы:
   Для начала нам нужно создать схему с помощью Yup. Он определяет форму и правила проверки данных нашей формы. Вот пример:

import * as Yup from 'yup';
const schema = Yup.object().shape({
  name: Yup.string().required('Name is required'),
  email: Yup.string().email('Invalid email').required('Email is required'),
  age: Yup.number().positive('Age must be a positive number').required('Age is required'),
});

1. Проверка данных.
   После того как у нас есть схема, мы можем использовать ее для проверки данных формы. Да, для этой цели предусмотрен метод validate. Давайте посмотрим:

const data = {
  name: 'John Doe',
  email: 'john@example.com',
  age: 25,
};
schema
  .validate(data)
  .then(() => {
    // Data is valid
    console.log('Data is valid');
  })
  .catch((errors) => {
    // Data is invalid
    console.error(errors);
  });

1. Асинхронная проверка:
   Да, также поддерживается асинхронная проверка, которая полезна, когда вам нужно выполнить проверку, включающую асинхронные операции, такие как вызовы API. Вот пример:

const schema = Yup.object().shape({
  username: Yup.string().required('Username is required').test(
    'username-exists',
    'Username already exists',
    async (value) => {
      // Simulating an API call
      const response = await fetch(`/api/username-exists?username=${value}`);
      const data = await response.json();
      return !data.exists;
    }
  ),
});

1. Пользовательская проверка:
   Иногда вам может потребоваться определить собственные правила проверки. Да, вы можете создавать собственные функции проверки с помощью метода test. Вот пример:

const schema = Yup.object().shape({
  password: Yup.string()
    .required('Password is required')
    .test('password-strength', 'Password is too weak', (value) => {
      // Custom validation logic
      return value && value.length >= 8 && /[a-z]/.test(value) && /[A-Z]/.test(value) && /\d/.test(value);
    }),
});

1. Сообщения об ошибках:
   Да, сообщения об ошибках при неудачных проверках предоставляются по умолчанию. Однако вы можете настроить эти сообщения в соответствии со своими потребностями. Вот пример:

const schema = Yup.object().shape({
  email: Yup.string().email('Invalid email').required('Please enter your email'),
});
schema.validate({ email: '' }).catch((error) => {
  console.error(error.message); // Output: "Please enter your email"
});

Вот и все! Мы рассмотрели некоторые распространенные методы и примеры проверки Yup в TypeScript. Надеемся, эта статья помогла вам начать работу с проверкой форм в ваших проектах TypeScript. Приятного кодирования!