Возьмем, к примеру, HTML-форму, которая собирает данные о человеке.
Примечание. Фрагменты кода упрощены и не полностью соответствуют снимку экрана. Кроме того, фрагменты кода написаны с использованием Yup, библиотеки, очень похожей на Joi и ориентированной на браузер, а не на NodeJS.
Чтобы отправить форму, я хочу выполнить проверки полей адреса и сделать их обязательными, но только в том случае, если пользователь частично заполнил раздел адреса. В целом, я хочу сделать информацию об адресе необязательной.
Вот упрощенная версия моего PersonSchema ...
import { object, string, number } from 'yup'
const PersonSchema = object().shape({
name: string().required(),
age: number()
.positive()
.integer()
.required(),
address: AddressSchema
})
Такое определение AddressSchema не работает, потому что поля всегда обязательны ...
const AddressSchema = object().shape({
street: string()
.min(2, 'Too Short!')
.max(50, 'Too Long!')
.required(),
city: string()
.min(2, 'Too Short!')
.max(50, 'Too Long!')
.required(),
state: string()
.min(2, 'Too Short!')
.max(50, 'Too Long!')
.required()
})
И здесь была моя попытка сделать поля адреса зависимыми от наличия других полей адреса, но это не работает, потому что вы сталкиваетесь с проблемами циклической зависимости ...
const AddressSchema = object().shape({
street: string()
.when(['city', 'state'], {
is: (city, state) => city || state,
then: string()
.min(2, 'Too Short!')
.max(50, 'Too Long!')
.required(),
otherwise: string()
}),
city: string()
.when(['street', 'state'], {
is: (street, state) => street || state,
then: string()
.min(2, 'Too Short!')
.max(50, 'Too Long!')
.required(),
otherwise: string()
}),
state: string()
.when(['street', 'city'], {
is: (street, city) => street || city,
then: string()
.min(2, 'Too Short!')
.max(50, 'Too Long!')
.required(),
otherwise: string()
})
})