Replies: 1 comment
-
I ended up building up the schema using the spread operator and then creating the yup object from the result in a computed. const searchSchema = computed(() => {
let schema = {};
if (searchParams.value.Type === "Individual") {
schema = {
...schema,
First: yup.string().required().label("First Name"),
Last: yup.string().required().label("Last Name"),
};
}
if (searchParams.value.Type === "Business") {
schema = {
...schema,
Business: yup.string().required().label("Business"),
};
}
if (searchParams.value.Type === "Property") {
schema = {
...schema,
Address: yup.string().required().label("Address"),
State: yup.string().required().label("State"),
};
}
return yup.object(schema);
}); |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
I often have whole sub-sections of forms that are hidden using v-if based on the value of other fields. My understanding of conditional validation with VeeValidate is that VeeValidate doesn't take into account whether a field is visible, and you have to modify the schema itself to make it conditional.
For a few fields, using yup's .when() is easy to do or using a computed schema with some ternary-controlled validation setting. This would be inconvenient for a whole section of a form.
I can think of three options, and I'd like feedback or suggestions on which might be a better approach.
Beta Was this translation helpful? Give feedback.
All reactions