西安模板建站公司_app开发公司 杭州_爱站网关键词查询系统_搜狗收录批量查询

安装 npm install vue-verify-plugin

使用

main.js

import Vue from "vue";import verify from "vue-verify-plugin";Vue.use(verify,{blur:true});

 使用

<template><div class="input-box clearFix"><div><input v-model="age" v-verify="age" placeholder="age"/><label class="fl" v-remind="age"></label></div><div><input type="text" class="phoneIcon fl" placeholder="手机号码" v-model="regInfo.phone" v-verify="regInfo.phone"><label class="fl" v-remind="regInfo.phone"></label></div><button v-on:click="submit">提交</button></div>
</template>

<script>

 export default {name: 'app',data () {return {age:"",regInfo: {phone: ""}}},verify: {age:"required",regInfo: {phone: ["required","mobile"]}},methods:{submit: function () {console.log(this.$verify.check());console.log(this.$verify.check('age'));}}}

</script>

v-verify 修饰符说明
 

//自定义teacher分组
v-verify.teacher

//验证student 分组
this.$verify.check("student")

v-verify指令也可使用 arg参数进行验证分组

如果同时使用修饰符和arg分组 则arg会覆盖修饰符分组

v-verify:student
//验证student 分组
this.$verify.check("student")

v-remind 验证错误提示

 

来自： vue-verify-plugin - npm