Интересная асинхронная проверка async-validator

JavaScript

async-validatorЭто чистая библиотека js, которая может выполнять асинхронную проверку данных.async-validatorоснован на раннемasync-validateизменено, но появилось раньшеasync-validateОн не использовался большим количеством людей, но был модифицирован на его основе.async-validatorЭто привлекло внимание и использование многих людей.В настоящее время количество звезд находится в5.2KЭто очень полезно для проверки формы. всегда любопытноant.designсерединаFormКак происходит проверка формы. Затем я пошел на github, чтобы найти его с учебным отношением, и нашел его.Этот автор тоже отличный.

ant.design formиспользовалrc-formупакованныйFormкомпоненты, при этомrc-formиспользуется вasync-validatorПроверка формы плагином.element-uiОн также используетсяasync-validatorПроверка формы завершена.

import schema from 'async-validator';

let descriptor = {
    name: {
        type: "string",
        required: true,
        validator: (rule, value) => value === 'muji',
    },
    age: {
        type: "number",
        asyncValidator: (rule, value) => {
            return new Promise((resolve, reject) => {
                if (value < 18) {
                    reject("too young");  // reject with error message
                } else {
                    resolve();
                }
            });
        }
    },
    address: {
        validator(rule, value, callback){
            return value === 'test';
        },
        message: 'Value is not equal to "test".',
    }
};
let validator = new schema(descriptor);
validator.validate({name: "muji"}, (errors, fields) => {
    if(errors) {
        // validation failed, errors is an array of all errors
        // fields is an object keyed by field name with an array of
        // errors per field
        return handleErrors(errors, fields);
    }
    // validation passed
});

// PROMISE USAGE
validator.validate({ name: "muji", age: 16 }).then(() => {
    // validation passed or without error message
}).catch(({ errors, fields }) => {
    return handleErrors(errors, fields);
})
  • Необходимыйrequired

Указывает, является ли поле обязательным

  • пространствоwhitespace

Указывает, разрешено ли несколько (более одного) последовательных пробелов перед входной строкой

  • Типыtype

    Указывает тип значения, которое может принимать это поле.

    • integer-- Формирование
    • float-- плавать
    • array-- множество
    • regexp-- регулярное выражение
    • object-- объект
    • method-- функция функция
    • email-- Почта
    • number-- количество
    • date-- дата новая дата()
    • url-- URL-адрес
    • hex-- шестнадцатеричное число

  • интервалrange

    Указывает длину значения, принимаемого полем, минимальный и максимальный допустимый диапазон значений.

    • length-- Фиксированная длина
    • min-- минимум
    • max-- Макс
    • range-- [мин Макс]

  • перечислитьenum

Перечисление допускает значения для этого поля, совпадающие хотя бы с одним из них

  • Обычныйpattern

Соответствует ли полученное значение поля требованиям путем сопоставления с регулярным выражением

Категории