经过排查,如果自定义验证中,每种情况都要写明确和有回调函数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&&reg.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的代码不执行的更多相关文章

  1. 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题

        方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...

  2. vue + element ui 阻止表单输入框回车刷新页面

    问题 在 vue+element ui 中只有一个输入框(el-input)的情况下,回车会提交表单. 解决方案 在 el-form 上加上 @submit.native.prevent 这个则会阻止 ...

  3. JS判断字符串长度,结合element el-input el-form 表单验证(英文占1个字符,中文汉字占2个字符)

    首先看看判断字符串长度的几种方法(英文占1个字符,中文汉字占2个字符) 方法一: function strlen(str) { var len = 0; for (var i = 0; i < ...

  4. 表单验证插件之jquery.validate.js

    提到表单验证的插件,第一个想到的就是jquery.validate.js,所以小生想在这里稍微详细地说一下这款插件的具体使用方法,便于理解,我直接附上整段demo的代码(没怎么调样式,主要是看js): ...

  5. element ui form表单清空规则

    公司项目重构,经过商定使用element ui.在重构项目的时候发现一下element ui上很蛋疼的东西. 例如,这个form表单就是一个.趁着在高铁上没事,把想写的东西写一下. 先说一下eleme ...

  6. vue+element ui 重置表单

    <el-dialog :title="addForm.title" :visible.sync="dialogFormVisible" width=&qu ...

  7. element ui FORM表单

    form表单 Form-Item Slot [label] 旧版语法 <el-form-item label="活动名称" prop="name"> ...

  8. vue+element之多表单验证

    方法一:利用promise var p1=new Promise(function(resolve, reject) { this.$refs[form1].validate((valid) => ...

  9. vue+element 正则表达式进行表单验证

    <template> <el-form :model="form" label-width="115px" ref="form&qu ...

随机推荐

  1. Selenium库详解

    Selenium 自动化测试工具,支持多种浏览器 爬虫中解决JS渲染问题

  2. 数据库 查询第31-40行数据,ID不连续

    一.SQLServer 大致分为两种情况:ID连续和ID不连续. 1.ID连续的情况: select * from A where ID between 31 and 40 2.ID不连续的情况: ( ...

  3. Python学习笔记3 函数_20170614

    # 函数 定义 def my_abs(x) : if not isinstance(x, (int, float)) : raise TypeError('bad operand type') if ...

  4. BZOJ2073 「POI2004」PRZ 状压DP

    问题描述 BZOJ2073 题解 发现 \(n \le 16\) ,显然想到状压 设 \(opt[S]\) 代表过河集合为 \(S\) 时,最小时间. 枚举 \(S\) 的子集,进行转移 枚举子集的方 ...

  5. bcftools

    beftools非常复杂,大概有20个命令,每个命令下面还有N多个参数 annotate .. edit VCF files, add or remove annotations call .. SN ...

  6. Eclipse左侧的工程目录消失解决办法

    菜单栏window---->show view--->other--->project explorer

  7. 基于Django的Rest Framework框架的认证组件

    0|1一.认证组件的作用 在一个程序中有一些功能是需要登录才能使用的,原生Django中的auth组件可以用来解决这个认证问题,drf框架中也有对应的认证组件来解决这个问题. models.py   ...

  8. tomcat参数java_opts调整

    启动文件修改 在windows环境下,tomcat下的~/bin/catalina.bat文件,在文件头部加入: set "JAVA_OPTS=%JAVA_OPTS% -server -Xm ...

  9. CSS3实现文字描边的2种方法

    问题 最近遇到一个需求,需要实现文字的描边效果,如下图           解决方法一     首先想到去看CSS3有没有什么属性可以实现,后来被我找到了text-stroke     该属性是一个复 ...

  10. Spring @CrossOrigin 通配符 解决跨域问题

    @CrossOrigin 通配符 解决跨域问题 痛点: 对很多api接口需要 开放H5 Ajax跨域请求支持 由于环境多套域名不同,而CrossOrigin 原生只支持* 或者具体域名的跨域支持 所以 ...