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 ...
随机推荐
- 访问rabbitmq-server失败
测试项目正常运行突然访问不了,各项目启动失败,查看日志发现是RabbitMQ拒绝连接. 重启后依然失败,看var/log/rabbitmq/startup_err 发现什么错误信息也没有,后查看磁盘空 ...
- semantic功能介绍
semantic功能介绍 gnu Semantic Manual 1,代码自动补全 3,代码导航 启动semantic功能:(semantic-mode 1) 1,Semantic mode 是辅助模 ...
- 修改postgresql 密码
sudo -u postgres psql -c "alter user postgres password '123456';"
- 如何将MagicaVoxel模型导入UE4中(1)
前言 当初在选择自己项目的美术风格时,由于自己的美术基础实在是太差,所以选择了体素风格来构建(其实还是MagicaVoxel的建模操作很容易上手),但是将自己千辛万苦做好的模型导入至项目中时,出现了这 ...
- c# 第26节 Main方法
本节内容: 1:Main方法 2:Main方法的定义 3:测试Main函数传入参数 4:Main的大总结 1:Main方法是什么 2:Main方法的定义 3:测试打印出外部传入Main的参数 clas ...
- grub2详解
本文主要介绍的是grub2,在文末对传统grub进行了简述,但在grub2的内容部分中包含了很多grub2和传统grub的对比. 如果仅仅是想知道grub2中的boot.img/core.img/di ...
- Mybatis全局配置文件详解(三)
每个基于Mybatis应用都是以一个SqlSessionFactory实例为中心.SqlSessionFactory实例可以由SqlSessionFactoryBuild获得,而SqlSessionF ...
- vue中的router和route有什么区别?
我只知道前者一般用在跳转路由的时候,push一个url, 而后者则用来存储路由跳转过程中存储的各种数据. 话不多说,这篇博客讲的比较详细,可以参考一下. vue2.0中的$router 和 $rout ...
- Ajax常用例子 Post 和 Get
1. 前台:Post$.ajax({ url: "@Url.Action("Save", "UserFun")", type: " ...
- IDEA取消SVN关联 , 在重新分享项目
IDEA取消SVN关联,在重新分享项目 安装插件 1.打开Intellij中工具栏File的setting(ctrl+alt+s),选择plugins,在右边搜索框输入“SVN”,搜索.选择“ ...