Questions tagged [yup]

Yup is a JavaScript object schema validator and object parser based on Joi

Yup is a JavaScript object schema validator and object parser. The API and style is inspired by Joi.

Yup is leaner than Joi: in the same spirit, without some of the fancy features. You can use it on the server as well, but in that case you might as well just use Joi.

Yup is also a good bit less opinionated than joi, allowing for custom transformations and async validation. It also allows "stacking" conditions via when for properties that depend on more than one other sibling or child property. Yup separates the parsing and validating functions into separate steps so it can be used to parse json separate from validating it, via the cast method.

Documentation and source can be found on the yup github page

1580 questions
21
votes
2 answers

Create dynamic Yup validation schema from JSON

I'm trying to use Yup along with Formik in my react form. The form fields are going to be dynamic so as their validations. export const formData = [ { id: "name", label: "Full name", placeholder: "Enter full name", type: "text", …
vijayscode
  • 1,905
  • 4
  • 21
  • 37
19
votes
4 answers

How to assign object validation in yup for react-select (single-select)

I am trying to implement validation for react-select (single-select) using yup concept. But i am getting this error: Objects are not valid as a React child (found: object with keys {label, value}). If you meant to render a collection of children,…
Taruni
  • 201
  • 1
  • 3
  • 6
18
votes
2 answers

Yup validation for a non-required field

I have a profile creation form in my project for which i am using react-hooks-form and yup library for validation. In the form there is one field named Github-Username which is optional. But i want to validate it if users enters the username and it…
lazyCoder
  • 499
  • 1
  • 4
  • 17
18
votes
1 answer

How to write a custom schema validation using yup.addMethod() for country name and code?

I'm trying to add form validations using yup to a React form component using formik. My validation seems to work, but I find it too verbose. Trying to use the .addMethod() function of yup, but getting stuck on the syntax or maybe this is…
intercoder
  • 2,171
  • 7
  • 23
  • 34
18
votes
6 answers

Validating file size and format with YUP

I have a form using reactjs + formik + yup. I have a multi file upload field. I want to validate the file format and max size using yup. How can I do this?
ComCool
  • 773
  • 4
  • 15
  • 28
18
votes
3 answers

Formik and Yup : TypeError: Cannot read property 'object' of undefined

I am new to React and was trying out formik with yup for the validation. I am currently getting the error below: TypeError: Cannot read property 'object' of undefined with this code: validationSchema: Yup.object().shape({ firstName:…
Shawn
  • 331
  • 1
  • 3
  • 7
17
votes
3 answers

Yup: Validating Array of Strings That Can Be Empty

I have the following as a form field type for Formik: interface FormFields { groups: string[]; } I'm trying to pass a Yup schema that will validate the above: the fact that it can be an empty array (must be defined) but can also contain…
Sammy
  • 3,395
  • 7
  • 49
  • 95
17
votes
6 answers

Validation using Formik with Yup and React-select

I'm working with a react form validation using Yup along with Formik. There is a react-select element in the form which needs to be validated as well. For validation i'm making use of validationSchema of Formik to validate form on value change. I…
Nik
  • 1,589
  • 2
  • 15
  • 23
17
votes
1 answer

yup: compare field itself with another field

I had StartIntensity: yup.number(), EndIntensity: yup .number() .when( "StartIntensity", (StartIntensity: number, schema: any) => { return !!StartIntensity ? schema.moreThan( …
Heidel
  • 3,174
  • 16
  • 52
  • 84
17
votes
6 answers

How to test for uniqueness of value in Yup.array?

I have form with dynamic amount of inputs (admin email) however checking for uniqueness fails: validationSchema={Yup.object().shape({ adminEmails: Yup.array() .of( Yup.string() …
IProblemFactory
  • 9,551
  • 8
  • 50
  • 66
16
votes
3 answers

yup.js Validate number field is larger than sibling, or nullable

I'm using Yup.js to validate some form fields. I have two integer fields, Year Built & Year Renovated. Year Built is a required field, Year Renovated is not. Year renovated can be left blank, however if there is a value it should be larger than…
ZAR
  • 2,550
  • 4
  • 36
  • 66
16
votes
5 answers

React Formik + Yup, onChange touch the field

I would like to conditionally display errors in my form. The way formik works is that if you change one field all validations are ran and all errors returned even thought you changed just one. I would like to display the error only if the field was…
Lucian Tarna
  • 1,806
  • 4
  • 25
  • 48
15
votes
1 answer

How to get Yup to perform more than one custom validation?

I'm working on a ReactJS project. I'm learning to use Yup for Validation with FormIk . The following code works fine: const ValidationSchema = Yup.object().shape({ paymentCardName: Yup.string().required(s.validation.paymentCardName.required), …
John
  • 32,403
  • 80
  • 251
  • 422
15
votes
1 answer

Validation using Yup to check array length --> error if length === 1

I have the following object: { array: [1] } And the following code: myArray: Yup.array().of( Yup.object().shape({ name: Yup.string().max(255).required().label('Name') }) ) Now I check the name is required, I need to check if…
15
votes
1 answer

Yup nested schema validation

I'm trying to validate an object conditionally on a Select Option that's been chosen by a user, the issue is I'm rendering a currency list and having immense difficulty trying to make it a required field, as I have to pass in an empty object to…
Xavier
  • 831
  • 3
  • 9
  • 22