I am getting the following error when I am adding schema to my form, error:
Uncaught (in promise) TypeError: branch is not a function
Following is the yup
based schema that I am adding to my form:
export const mySchema = (t) =>
yup.object().shape({
type: yup.string().required("Type is Required"),
gType: yup.string().when("type", {
is: (type) => type === "TYPE1" || type === "TYPE2",
then: (schema) => schema.required("G Type is required"),
}),
identifier: yup.string().when("type", {
is: (type) => {
return (type === "TYPE1" || type === "TYPE2");
},
then: (schema) =>
schema.required("Identifier is required").matches(/^.{13}$/, "Identifier Must be Numeric"),
}),
extension: yup.string().when(["type", "gType"], {
is: (type, gType) => {
return (type === "TYPE2" || gType === "IDTYPE");
},
then: yup.string().required("Extension is required"),
}),
});
The issue is mainly happenning for the extension
field where I want to make the field required based on 2 diffrerent field values type
and gType
. But when I check for the values I am able to console.log them within the yup schema:
is: (type, gType) => {
console.log("Type : " + type)
console.log("GType : " + gType)
return (type === "TYPE2" || gType === "IDTYPE");
},
But for some reason I am getting the above mentioned error along with the console.log. I have checked my vee-validate
Form and Field and provided the name and everything. If I remove the extension
from above schema then everything works fine but adding it fails.
I also tried to obtain the array something like this, but doing so I am able to get only the type
and gType
for some reason shows as undefined:
extension: yup.string().when(["type", "gType"], {
is: (values) => values[0] === "TYPE2" || values[1] === "IDTYPE",
then: yup.string().required("Extension is required"),
}),
Can someone please let me know how to fix this issue?