转载

一款简单轻量的 Vue 表单校验插件,支持 1.x 和 2.0

Vuerify

Validation plugin for Vue.js

Features

  • Supports both Vue 1.x and 2.0
  • Compact
  • Simple

Demo

  • basic
  • directive
  • directive for Vue2.0
  • mint-ui

Docs

  • 中文文档
  • Documentation

Installation

npm i vuerify -S

install directive

# Vue 1.x npm i v-vuerify -S  # Vue 2.x npm i v-vuerify-next -S

Usage

import Vue from 'vue' import Vuerify from 'vuerify'  Vue.use(Vuerify, /* add rules */)

component

{   template: `     <form @submit.prevent="handleSumit">       <input type="text" v-model="username">       <input type="password" v-model="password">       <input type="password" v-model="conform">       <input type="sumit">       <ul><li v-for="err in errors" v-text="err"></li></ul>     </form>   `,   data () {     return {       username: '',       password: '',       conform: ''     }   },    vuerify: {     username: 'required',     password: {       test: //w{4,}/,       message: '至少四位字符'     },     conform: {       test (val) {         return val === this.password       },       message: '密码输入不一致'     }   },    compouted: {     errors () {       return this.$vuerify.$errors     }   },    methods: {     handleSumit () {       if (this.$vuerify.check()) {         // do sth       }     }   } }

TODO

  • docs

License

WTFPL

原文  https://github.com/QingWei-Li/vuerify
正文到此结束
Loading...