Tiny Async & AJAX Form Validation Library For Vue – Input Validator

Install & Download:

# Yarn
$ yarn add @mediv0/validator
# NPM
$ npm i @mediv0/validator

Description:

A lightweight, customizable, extensible, mobile-friendly form validator that supports real-time, async, and ajax validation.

How to use it:

1. Import and register the component.

import Vue from "vue;
import validator from @mediv0/validator;

Vue.use(validator, options);

2. Attach the form validator to input fields using the v-validator directive.

<input v-validator="validatorOptions" />

export default {
  data(){
    return {
      validatorOptions: { ... } 
    }
  }
}

3. Possible validator options.

key?: string;
hideLines?: boolean;
hideLabels?: boolean;
circleSize?: number;
disable?: boolean;
debounce?: number;
items: checkPropertyItemsType;
onError?: IonError;
onSuccess?: Function;

4. Possible plugin options.

Vue.use(validator, {
  name: "validator",
  success: "#2DE68F",
  failed: "#979797", 
  unchecked: "#FF4343"
});

Preview: