ASP.NET Core 3 and React

Adding validation rules to the Form component

We are going to add validation rules to the Form component so that they can be consumed like in the following example with a validationRules prop:

<Form  validationRules={{    title: [{ validator: required }, { validator: minLength, arg: 10     }],    content: [{ validator: required }, { validator: minLength, arg:     50 }],  }}  ...>  ...</Form>

The validationRules prop will allow consumers to define an array of validation rules for each field in the form. A validation rule references a function that will do the necessary check on the value in the field. We will refer to these functions as validators.

We'll carry out the following steps to implement the validationRules prop in the Form component:

1. Let's start ...