Vue 2 / Laravel – Form validation with Vee-Validate

If you use Vue 2 with laravel, there is a big chance that you will need create a form validation, this is simple task if you use Vee-Validate:

Install with npm

npm install vee-validate --save

Import vee-validate inside your component

import VeeValidate from 'vee-validate';

Use vee-validate tags inside the inputs that you need validate, in this example I show you how to make a input required, you need to set a name and write the rules as a string like you use in Laravel Validate. Remember to use DOUBLE quotes to open v-validate tag and use SINGLE quotes to write the string .

I’m using v-validate.initial because I need that this input be checked as soon as the page is loaded, if you don’t you .initial, this validation will be checked when the input lose focus.

<input type="text" v-model="userName" name="userName" v-validate.initial="'required'" >
<button :disabled="errors.has('userName')" >

Read vee-validate documentation to list all rules and methods available.

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *