Yup validation doesn't work when use not(!) in matches function

Question

I have a project with React and next js. I use formik for handling my forms and Yup for validations I have an input and I want perform some validations on it.

1. this field must be required so if user don't enter any information I show this message => Required
2. this field should not contain any numbers otherwise I Show this message => Wrongggg
3. this field must only contain Persian characters otherwise I Show this message => only Persian chars

this is my schema

 Yup.string()
            .required("Requiredddd")
            .matches(!/\d/, 'Wrongggg'),
            .matches(/^[\u0600-\u06FF\s]+$/, 'Only persian chars')

But in this case condition number 2 always Considered wrong.i think (!/\d/) is wrong but I haven't any idea how can use matches function Negatively

Alost

Did you try .matches(/\D/, 'Wrongggg') instead? – Camilacamile

Answer 1

According to yup you can use .matches using this shape: string.matches(regex: Regex, message?: string | function): Schema. If you want to validate that the string doesn't contain numbers, instead of using (!/\d/) you should use /\D+$/.

 Yup.string()
            .required("Requiredddd")
            .matches(/\D+$/, 'Wrongggg')
            .matches(/^[\u0600-\u06FF\s]+$/, 'Only persian chars')

See working example

Camilacamile

this regex worked => /^([^0-9]*)$/ but it is not => /\D/ – Alost

I updated my answer. I changed regex to /\D+$/ – Camilacamile

Answer 2

You can do it with the test() function from Yup like the following:

.test('name Your Test here', 'your validation message', (value) => !yourRegex.test(value))

I believe Yup should provide an opposite function for .match() since you don't always want to match, sometimes you want to test your value against the regex.

Iredale