element-ui的表单验证this.$refs[formName].validate的代码不执行
经过排查,如果自定义验证中,每种情况都要写明确和有回调函数callback
var validatePhone = (rule, value, callback) => {
const reg = /^(0|86|17951)?(13[0-9]|15[012356789]|166|17[3678]|18[0-9]|14[57])[0-9]{8}$/;
if (value!== "") {
if (value === "") {
callback(new Error("请输入手机号"));
} else if(value.length==11&®.test(value)){
callback();
} else {
callback(new Error("请输入正确的手机号"));
}
} else {
callback(new Error("请输入手机号"));
}
};
上面是自定义验证,写在data里面。如果验证通过,但是没有加上callback(),则validate里面的代码会一直不执行。
小结:用于判断值的情况用value比较好,
value的值为相对于的表单元素的v-model的值
rule是验证规则,
callback是回调函数,每个判断结束,语句后面要callback(。。)结果给validate,不然validate会一直等待返回的回掉,不往下执行代码。
element-ui的表单验证this.$refs[formName].validate的代码不执行的更多相关文章
- 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题
方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...
- vue + element ui 阻止表单输入框回车刷新页面
问题 在 vue+element ui 中只有一个输入框(el-input)的情况下,回车会提交表单. 解决方案 在 el-form 上加上 @submit.native.prevent 这个则会阻止 ...
- JS判断字符串长度,结合element el-input el-form 表单验证(英文占1个字符,中文汉字占2个字符)
首先看看判断字符串长度的几种方法(英文占1个字符,中文汉字占2个字符) 方法一: function strlen(str) { var len = 0; for (var i = 0; i < ...
- 表单验证插件之jquery.validate.js
提到表单验证的插件,第一个想到的就是jquery.validate.js,所以小生想在这里稍微详细地说一下这款插件的具体使用方法,便于理解,我直接附上整段demo的代码(没怎么调样式,主要是看js): ...
- element ui form表单清空规则
公司项目重构,经过商定使用element ui.在重构项目的时候发现一下element ui上很蛋疼的东西. 例如,这个form表单就是一个.趁着在高铁上没事,把想写的东西写一下. 先说一下eleme ...
- vue+element ui 重置表单
<el-dialog :title="addForm.title" :visible.sync="dialogFormVisible" width=&qu ...
- element ui FORM表单
form表单 Form-Item Slot [label] 旧版语法 <el-form-item label="活动名称" prop="name"> ...
- vue+element之多表单验证
方法一:利用promise var p1=new Promise(function(resolve, reject) { this.$refs[form1].validate((valid) => ...
- vue+element 正则表达式进行表单验证
<template> <el-form :model="form" label-width="115px" ref="form&qu ...
随机推荐
- Ingo Molnar 的实时补丁
一.简介 Ingo Molnar 的实时补丁是完全开源的,它采用的实时实现技术完全类似于Timesys Linux,而且中断线程化的代码是基于TimeSys Linux的中断线程化代码的.这些实时实现 ...
- 海思屏幕HAL代码解析
显示屏幕(LCD)模块提供屏幕相关功能接口,调用者为上层应用模块(含 init.状态机.ui),上下文依赖关系,如图 3-7 所示. 系统框架为 linux+Huawei LiteOS 双系统架构,媒 ...
- CodeForces 1236D(模拟)
题意 https://vjudge.net/problem/CodeForces-1236D 最近,爱丽丝得到了一个新玩偶.它甚至可以走路! 爱丽丝为玩偶建造了一个迷宫,并想对其进行测试.迷宫具有n行 ...
- vue.nextTick()方法的使用详解
什么是Vue.nextTick()?? 定义:在下次 DOM 更新循环结束之后执行延迟回调.在修改数据之后立即使用这个方法,获取更新后的 DOM. 所以就衍生出了这个获取更新后的DOM的Vue方法 ...
- Markdown & LaTex 常用语法
目录 blog 的目录 博客园自带目录 用 javascript 自定义目录 主标题 副标题 h1,一级标题 h2,二级标题 h3,三级标题 注释 常用的符号及文本形式 如果你想在markdown中文 ...
- css3之水波效果
这些效果可谓多种多样,当然用canvas.svg也都能实现奈何对这些有不熟悉(尴尬),不过咱们用css来写貌似也没想象中的那么难吧. 一 悬浮球水波效果 效果图 css .container { w ...
- vue项目搭建介绍01
目录 vue项目搭建介绍01 vue 项目框架环境搭建: 创建项目: vue 项目创建流程: vue项目搭建介绍01 vue 项目框架环境搭建: vue 项目框架: vue django(类似)(vu ...
- H5开发 连接蓝牙打印机 打印标签(斑马ZR628)
1.连接蓝牙打印机(先用手机自带蓝牙进行配对),然后绑定出已配对的蓝牙设备(用来选择/切换打印机之用),代码如下 已配对蓝牙设备,中显示的就是已连接的,点击一下即可 代码: <!DOCTYPE ...
- 【转】python中的闭包
转自:http://www.cnblogs.com/ma6174/archive/2013/04/15/3022548.html python中的闭包 什么是闭包? 简单说,闭包就是根据不同的配置信息 ...
- Windows Azure Virtual Machine (39) 清除Linux挖矿病毒
<Windows Azure Platform 系列文章目录> 1.之前客户遇到了Azure Linux CPU 100%,症状如下: 2.SSH登录到Linux,查看crontab,有从 ...