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 ...
随机推荐
- Linux根目录下各目录含义
/boot:系统启动的相关文件,比如内核,grub /etc:配置文件 /dev:设备文件 /root:root用户的家目录 /home:用户家目录 /lib:库文件 /bin:用户的命令文件 /sb ...
- [MySQL] 解决Error 1698: Access denied for user 'root'@'localhost'
当程序中使用root账号连接mysql时报以下错误,但是使用命令行是可以正常连接的,那么就查询下mysql数据库的user表,查看下当前用户的密码加密方式,看看是不是unix_socketMariaD ...
- background-origin和background-origin和2D转换
1--> background-origin:可以定义背景图片的定位区域,它有3个属性值 background-origin:border-box /padding-box/ content-b ...
- 01-day-vuex的使用
知识点1===>简单的使用vuex 进行state取值 使用yarn下载 yarn add vuex -D vuex的包叫做 store 跟pages同级 创建store文件夹,文件夹下有sto ...
- 利用java程序构造mysql测试数据
package com.baidu.mysql;import java.sql.*; public class MysqlJdbc { /** * @param args */ public stat ...
- json.loads() json解码
有些json数据里面套着json 一次json.loads()后还是会有数据是json格式 { "result": { "error_code": 0, ...
- 第十周计划周二&周三计划
今天又一次被导师训了,怎么也达不到他的要求,好像我俩不在一条线上.所以现在重新整理一遍思路,继续走. 我认为重点还是主题追踪这一块,但是主题追踪的结果以及显示是个问题,目前还是打算做出来当天最热的前几 ...
- SVN 中项目名字全是红色 和 文件夹图标上没标记绿钩解决办法
没有绿色标记卸载Tortoise 小乌龟重装 ! 红色名字是 原来idea当前的project用了版本控制器, 那么建到这个project下面的所有项目就都是加入到版本控制里面的, ...
- 【CF525E】Anya and Cubes(meet in middle)
点此看题面 大致题意: 在\(n\)个数中选任意个数,并使其中至多\(k\)个数\(x_i\)变为\(x_i!\),求使这些数和为\(S\)的方案数. \(meet\ in\ middle\) 这应该 ...
- Exception "java.lang.ClassNotFoundException: com/intellij/codeInsight/editorActions/FoldingData"while constructing DataFlavor for: application/x-java-jvm-local-objectref; class=com.intellij.codeInsigh
java.lang.ClassNotFoundException in matlabR2014a 就是MATLAB和pycharm不能同时运行.关闭pycharm然后打开MATLAB就可以了.