Saltar al contenido

Ejemplo de código de validación de Yup

Indagamos en distintos sitios para así tenerte la solución a tu problema, si tienes alguna inquietud déjanos tu pregunta y te responderemos sin falta, porque estamos para servirte.

Ejemplo 1: validación de teléfono sí

const phoneRegExp =/^((\+[1-9]1,4[\-]*)|(\([0-9]2,3\)[\-]*)|([0-9]2,4)[\-]*)*?[0-9]3,4?[\-]*[0-9]3,4?$/

phoneNumber:Yup.string().matches(phoneRegExp,'Phone number is not valid')

Ejemplo 2: validación de contraseña sí

import*asYupfrom'yup';

validationSchema:Yup.object(
  password:Yup.string().required('Password is required'),
  passwordConfirmation:Yup.string().oneOf([Yup.ref('password'),null],'Passwords must match'));

Ejemplo 3: sí, solo los caracteres de validación de expresiones regulares reaccionan

yup.string().required("Please enter the required field").matches(/^[aA-zZs]+$/,"Only alphabets are allowed for this field ")

Ejemplo 4: sí npm

npm i yup --save

Ejemplo 5: formik y yup

importReactfrom'react';importFormik,Field,Form,ErrorMessagefrom'formik';import*asYupfrom'yup';constSignupForm=()=>return(<Formik
       initialValues= firstName:'', lastName:'', email:''
       validationSchema=Yup.object(
         firstName:Yup.string().max(15,'Must be 15 characters or less').required('Required'),
         lastName:Yup.string().max(20,'Must be 20 characters or less').required('Required'),
         email:Yup.string().email('Invalid email address').required('Required'),)
       onSubmit=(values, setSubmitting )=>setTimeout(()=>alert(JSON.stringify(values,null,2));setSubmitting(false);,400);><Form><label htmlFor="firstName">FirstName</label><Field name="firstName" type="text"/><ErrorMessage name="firstName"/><label htmlFor="lastName">LastName</label><Field name="lastName" type="text"/><ErrorMessage name="lastName"/><label htmlFor="email">EmailAddress</label><Field name="email" type="email"/><ErrorMessage name="email"/><button type="submit">Submit</button></Form></Formik>);;exportdefaultSignupForm;

Ejemplo 6: sí oneOf

// mixed.oneOf(arrayOfValues: Array, message?: string | function): Schema Alias: equals// Whitelist a set of values. Values added are automatically removed from any blacklist if they are in it. The $values interpolation can be used in the message argument.// Note that undefined does not fail this validator, even when undefined is not included in arrayOfValues. If you don't want undefined to be a valid value, you can use mixed.required.let schema = yup.mixed().oneOf(['jimmy',42]);await schema.isValid(42);// => trueawait schema.isValid('jimmy');// => trueawait schema.isValid(newDate());// => false

Si conservas algún cuestión y capacidad de reformar nuestro noticia te mencionamos añadir una explicación y con deseo lo observaremos.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *