🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

A simple, powerful and flexible validation library for Vue.js 2.0.

Form

Documentation

vue-validity

A simple, powerful and flexible validation library for Vue.js 2.0.

Features

  • Model-based validation.
  • Validate custom components.
  • Set custom errors (eg. server-side errors) via $setErrors.
  • Create custom validators along with custom errors messages.
  • Automatically adds input classes based on state (eg. 'dirty', 'invalid', etc.)

Installation

npm install --save vue-validity

import Vue from 'vue' import Validity from 'vue-validity'  // Optionally provide configuration options. Vue.use(Validity, {})

Basic usage

For each value you want to validate, you have to create a key inside validations options.

export default {   data () {     return {       name: ''     }   },   validations: {     name: ['required', 'minlength:4']   } }

This will result in the following validation object:

$v: {   "name": {     "required": {       "$value": false,       "$message": "name is required."     },     "minlength": {       "$value": true,       "$message": "name should be at least 4 chars."     },     "$valid": false,     "$dirty": false,     "$error": false,     "$errors": [       {         "field": "name",         "message": "name is required."       }     ]   },   "$valid": false,   "$dirty": false,   "$error": false,   "$errors": [     {       "field": "name",       "message": "name is required."     }   ] }

Checkout the docs for more examples: https://jrenton.github.io/vue-validity/

Contributing

# install dependencies npm install  # serve with hot reload at localhost:8080 npm run dev  # build for production with minification npm run build

License

MIT

Original vuelidate work Copyright (c) 2016 Paweł Grabarz & Damian Dulisz


You May Also Like