A simple yet flexible validator library for vue.js
Clone or download
Latest commit 81eb580 Apr 27, 2018
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist update Apr 27, 2018
doc-site update Apr 27, 2018
src update Apr 27, 2018
test Added tests and refactors rules Jan 24, 2018
.babelrc Added tests and refactors rules Jan 24, 2018
.gitignore minor update Dec 13, 2016
.jshintrc setup webpack structure Dec 10, 2016
LICENSE Initial commit Dec 9, 2016
README.md update Apr 27, 2018
TODO.md fix #11 Mar 19, 2017
bower.json update bower Dec 13, 2016
package-lock.json 0.15.0 Feb 17, 2018
package.json update Apr 27, 2018
postcss.config.js doc site basic style Dec 10, 2016
webpack-doc-site.config.js demo with code component Dec 12, 2016
webpack-lib.config.js replaced omit Jan 26, 2017
yarn.lock update Apr 27, 2018


Simple Vue Validator

Simple Vue validator is a lightweight yet flexible plugin for Vue.js 2.0 that allows you to validate input fields, and display errors. It watches changes of your model data, validates them and informs you with the validation result.

It supports the following features:

  • Fully customized validation rules.
  • Cross field validation.
  • Async/ajax validation (with supports of loading indicator, result caching, debounced user input).
  • Validating custom component.
  • Dynamic form / multiple validation instances.


Please checkout the full documentation for more detail.


Package is installable via npm.

npm install --save simple-vue-validator

You can also install it via bower.

bower install --save simple-vue-validator

NOTE: for bower package, please use /dist/plugin.js.


import Vue from 'vue';
import SimpleVueValidation from 'simple-vue-validator';

Basic Usage

Define the validators object in your vue / component instance:

validators: {
      email: function (value) {
        return Validator.value(value).required().email();

In the template HTML use the validation object injected by the library to display validation status / results.

<div class="message">{{ validation.firstError('email') }}</div>

Please checkout the full documentation for more detail.

license MIT