[Vuejs]-How to use v-text-area rules option?

by

0👍

In order to use Vuetify validation rules, you need to wrap all elements on which you want to perform validation in a <v-form> element.

On your input components, you need to provide an array to the rules prop with the names of functions you define which perform validation.

The functions which validate take the value as an input and return true if the input is valid and false or a failure string if the input is invalid.

An example of such a function defined in the methods section would be:

isNumber(input) {
  return /[0-9]+/g.test(input) || "input must be a number";
}

Passing it to your v-text-area would look like this:

  <v-text-area :rules="[isNumber]" />

More info is available in the #rules section of Vueitfy’s Form docs.

Leave a comment