vant+vee-validate校验的基本使用

Myth丶恋晨 2022-11-25 10:21 298阅读 0赞

*  main.js

//导入：
    import VeeValidate,{ Validator} from 'vee-validate';
    //方言包
    import zh_CN from "vee-validate/dist/locale/zh_CN.js";
    
    Vue.use(VeeValidate,{ 
      event:"blur"
    });
    
    //events为空
    //Vue.use(VeeValidate, { 
    // events: "" // 禁用校验事件
    //});
    
    //使用方言包
    Validator.localize("zh_CN",zh_CN);

*  login.vue

<van-cell-group>
    		<van-field v-model="phone" name="phone" required label="手机号码" placeholder="请输入手机号" v-validate="'required'" :error-message="errors.first('phone')"/>
    		<van-field v-model="code" name="code" required label="验证码" placeholder="请输入验证码" v-validate="'required'" :error-message="errors.first('code')" />
    	</van-cell-group>
    	<van-button type="info" @click="login()">登录</van-button>
    	<script> export default { data() { return { phone: "11111111111", code: "123456" }, methods:{ //设置验证规则： setRules() { const dict = { custom: { phone: { required: "请输入手机号码" }, code: { required: () => "请输入验证码" } } }; // 使用验证规则 this.$validator.localize("zh_CN", dict); }, login() { this.$validator.validate().then(valid => { if (valid) { console.log('验证成功') } else { console.log(this.$validator.errors.all()); } }); } }, mounted(){ this.setRules(); } } </script>

发表评论取消回复

表情：

评论列表（有 0 条评论，298人围观）

还没有评论，来说两句吧...

相关阅读

相关 vant+vee-validate校验的基本使用

main.js //导入： import VeeValidate,{ Validator} from 'vee-validate'; //方言包

Myth丶恋晨/ 2022年11月25日 10:21/ 0 赞/ 299 阅读

相关 Springboot 使用校验框架validation校验

1.validation与 springboot 结合，不在用传统代码里面if 判断传统： if(id==null)\{ throw new Exception

╰+攻爆jí腚メ/ 2022年11月06日 06:49/ 0 赞/ 243 阅读

相关 spring boot（1）基本请求参数校验

spring boot（1）基本请求第一个 hello world 使用idea新建中的Spring Initializr创建一个spring boot项目勾选

雨点打透心脏的1/2处/ 2022年09月06日 00:27/ 0 赞/ 179 阅读

相关 Spring Boot参数校验以及分组校验的使用

简介：做web开发基本上每个接口都要对参数进行校验，如果参数比较少，还比较容易处理，一但参数比较多了的话代码中就会出现大量的if-else语句。虽然这种方式简单直接，但会大大

女爷i/ 2022年09月04日 04:54/ 0 赞/ 248 阅读

相关 Spring Boot参数校验以及分组校验的使用

Spring Boot参数校验以及分组校验的使用前言什么是validator 注解介绍 validator

- 日理万妓/ 2022年09月04日 02:49/ 0 赞/ 221 阅读

相关 springboot 使用校验框架validation校验

转载自：[http://blog.csdn.net/u012373815/article/details/72049796][http_blog.csdn.net_u01

深碍√TFBOYSˉ_/ 2022年06月13日 04:37/ 0 赞/ 315 阅读

相关使用JQuery和Ajax实现基本表单校验

使用JQuery和Ajax实现基本表单校验 -------------------- 本文实现的是使用JQuery和Ajax实现基本表单校验，包括前端校验以及用MVC

待我称王封你为后i/ 2022年06月08日 05:36/ 0 赞/ 206 阅读

相关基本校验

基本校验跳过校验的三种方式： 1. 使用注解@SkipValidation 2. 更改校验方法名validateReg 3. 使用xml进行配置

今天药忘吃喽~/ 2022年05月15日 03:57/ 0 赞/ 100 阅读

相关 struts2-输入校验、xml校验的使用

1、输入校验直接在Action类里添加相应的方法 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_

r囧r小猫/ 2022年02月26日 03:12/ 0 赞/ 301 阅读

相关 Springboot使用校验框架validation校验

1、pom引入 <dependency> <groupId>org.springframework.boot</groupId>

客官°小女子只卖身不卖艺/ 2021年12月12日 16:19/ 0 赞/ 374 阅读