когда нечего делать, а творческая душа требует реализации и хочется что-то сделать или написать, то я пишу сюда или делаю что-то на этом сайте. Кому интересна web-разработка, wordpress и то что рядом с этим, то заходите на мой сайт и читайте всякое...
Как получить значение Yup ref или написание собственных методов
Йо! Недавно мне довелось писать метод валидации промежутка дат для yup. Там мне понадобилось получить данные ref начальной даты в методе валидации конечной даты. В методах yup не очевидно как получать данные из ref в схемах не являющихся StringShema.
В этой статье я расскажу как получать данные ref yup’а не зависимо от типа схем.
Как создаются методы в yup
Сперва давайте вспомним как в yup создаются методы. Я уже частично рассматривал это в одной из статей, но в этот раз сделаю это подробнее.
Мы создаём функцию, которая принимает некоторые параметры из которой возвращаем изменённый каким-то образом this.
В JS это выглядит так:
function checkPayment(ref, msg) {
return this.test({
name: 'checkPaymentMethod',
exclusive: false,
message: msg || 'accountNumber not valid', // Сообщение об ошибке
params: { reference: ref ? ref.path : undefined },
test: function (value) {
return checkPaymetAccount(value, this.resolve(ref)) // Функция валидации
}
})
}
yup.addMethod(yup.string, 'checkPaymentMethod', checkPayment)
В TypeScript так:
function checkPayment(this: yup.StringSchema, ref: yup.Ref, msg?: string ) {
return this.test({
name: 'checkPaymentMethod',
exclusive: false,
message: msg || 'accountNumber not valid', // Сообщение об ошибке
params: { reference: ref ? ref.path : undefined },
test: function (value?: string) {
return checkPaymetAccount(value, this.resolve(ref)) // Функция валидации
}
})
}
yup.addMethod<yup.StringSchema>(yup.string, 'checkPaymentMethod', checkPayment)
Если вы добавляете метод к yup.string то в this функции есть метод this.resolve, который принимает ref и возвращает его значение и выглядит это так:
function checkPayment(ref, msg) {
const refValue = this.resolve(ref)
.......
}
Но если вы добавляете метод не к yup.string (yup.StringShema) то данный метод отсутствует. Что делать?! Yup всё предусмотрел (но не в документации).
Получаем данные ref
Дело в том, что в методах .test() yup’а существует собственный контекст (yup.TestContext), в котором всегда есть метод resolve, который и получает данные из ref.
В JS
function magicDate(ref, msg) {
const that = this
return that.test({
name: 'magicDate',
exclusive: false,
message: msg || 'magicDate not valid', // Сообщение об ошибке
params: { reference: ref ? ref.path : undefined },
test: function (value) {
const refValue = this.resolve(ref)
return // Ваша магия
}
})
}
yup.addMethod(yup.date, 'magicDate', magicDate)
Думаю, что не нужно объяснять, что в этом случае не подходят стрелочные функции.
Поддержи Xakplant
Я давно хочу развить видеоверсию, но пока этого не получается из-за нехватки ресурсов. Сейчас я собираю деньги на новый компьютер и микрофон. Поддержи xaklant и ты увидишь полезные видео быстрее.