this.$refs[formName].validate无效

最新推荐文章于 2024-08-09 14:16:18 发布
最新推荐文章于 2024-08-09 14:16:18 发布
阅读量2.3k 收藏
点赞数 2
分类专栏： vue elmentui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38686150/article/details/108050105
版权

this.$refs[formName].validate((valid) =>{} 无效

  • 确保每一个prop都写在标签上
<el-form-item label=" " prop="checked" >

  • 每一个 if 都要对应了一个 else 并且每个条件 下 都要 callback 确保 在不同情况下 都会执行callback

  • 打印一下this.$refs[formName]，检查是否拿到了正确的需要验证的form。查看绑定的元素是否写对

  • 如果前都没有问题，那么就是你的自定义的校验有问题，没有走通，这也是我踩过的坑。

  • 你可以依次注释掉的一个校验规则，看看注释掉哪个，功能实现了，就说明哪个的校验规则有问题

du_独孤九剑
关注
专栏目录
关于vue.js element ui 表单验证 使用this.$refs[formName].validate()
qq_41008567的博客
04-21 1万+
实现form表单提交验证功能 model : 绑定整个表单model值 rules : 整个表单校验规则 ref ：获取该表单form组件 prop : 绑定每个表单的规则，写在el-form-item上 validate : 对整个表单进行校验的方法 valid : 每个必填表单项都提交为true,否则为false 1、简易版 表单提交 //使用element-ui 页面组件 <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label
vue-element-ui 中使用 el-form 报错 “TypeError: this.$refs[formName] is undefined“
Anicer1219的博客
04-16 3114
情况说明：使用了 element-ui 里面 <el-form></el-form> 创建了个表单，但是取数据的时候，老是报错"TypeError: this.$refs[formName] is undefined"。按照网上搜来的在 mounted() 里面添加，但是没用啊。大好江山一片红，大家看看 前奏：皇天不负有心人，观察之前，也出现过这样的 bug，比如在这个 <img />标签里面按理说可以显示图片 <img :v-image-preview="
this.$refs[formName].validate((valid) =＞{}) 无效
qq_42309765的博客
12-21 1万+
elementUI 表单校验，在校验不通过时可以打印出值，校验通过反而不打印了 submitForm(formName) { console.log(1111); console.log("formName", formName); this.$refs[formName].validate((valid) => { if (valid) { //不打印 this.$message({ showClose
在Vue中this.$refs获取为undefined的原因和解决办法（this.$refs.属性为undefined原因）
最新发布
My_story_begins的博客
08-09 1980
this.$refs获取为undefined的原因和解决办法和this.$refs.属性为undefined原因
vue爬坑之路--------this$refs[formName]validate
aeo41593的博客
03-08 1715
vue element-ui使用自定义正则表达式： let validatePass = (rule, value, callback) => { let regExp = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{8,16}$/ if (value === '') { callback(new Err...
关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题
热门推荐
和子昭的博客
05-28 17万+
来自”和“小编的小提示：首先打印一下this.$refs[formName]，检查是否拿到了正确的需要验证的form。其次在拿到了正确的form后，检查该form上添加的表单验证是否正确，需要注意的点有：1.使用此方法前检查prop一定必须要写在&lt;el-form-item&gt;上面，写在里面的input上或者其他任何地方都不行（el-form-item prop属性绑定）2.el-form...
vue element表单校验失效（this.$refs[formName].validate）
weixin_56204435的博客
07-07 1000
【代码】vue element表单校验失效（this.$refs[formName].validate）
element ui -- 带自定义验证的表单 this.$refs[formName].validate()里面的内容不执行
liushan633的博客
12-10 2615
项目需要自定义验证，需要验证的参数都是后端传过来的， 如果传过来的是数字，就要根据后端返回的min和max验证数字大小，但是element ui没有验证数字大小的方法，但是可以自定义验证规则（官网给的自定义验证方法不能传参），所以有了下面的方法 rules.push({ validator: (rule, value, callback) =&gt; { if(min &amp...
this.$refs.form.validate is not a function
07-27
- *3* [解决表单校验报错‘this.$refs[formName].validate is not a function’](https://blog.csdn.net/weixin_67898309/article/details/125641437)[target="_blank" data-report-click={"spm":"1018.2226.3001....
element ui -- 表单验证 this.$refs[formName].validate()里面的内容不执行
bobobocai的博客
07-04 1万+
问题： 在做表单验证 this.$refs[formName].validate()里面的内容不执行 解决方案： 1、首先确保每个验证函数一定调用了callback()函数，在验证不通过、通过时都要调用callback()函数，这里return callback()与callback()都可以； 2、如果还是有问题，再打印this.$refs[formName]如果为空说明调用...
vue中表单的this.$refs[formname].validate不生效
weixin_44099519的博客
08-12 7918
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 欢迎使用Ma...
Vue进阶（幺幺叁）：element ui 表单验证 this.$refs[formName].validate()问题解决
IT全栈 华强工作室
04-21 5307
前言 在开发Vue项目过程中，应用element-ui做表单验证遇到this.$refs[formName].validate()提示validate()未定义的问题。 问题原因 要验证的DOM，还没有加载出来。 解决方法 首先打印一下this.$refs[formName]，检查是否拿到了正确的需要验证的form（有时候获取到数组，需要按下标取值）。 其次在拿到了正确的form后，检查该form...
表单验证 $refs----validate
weixin_44774699的博客
05-05 4765
表单验证 $refs----validate 表单验证 this.$refs[formName].validate() this.$refs[formName] 检查是否拿到了正确的需要验证的form； 1.使用此方法前检查prop一定必须要写在上面，写在里面的input上或者其他任何地方都不行（el-form-item prop属性绑定） 2.el-form rules，model属性绑定，ref标识 <el-form **ref="tbForm3"** ​
vue $refs validate校验不生效
ltf-spaceweixin_46032911的博客
08-10 2915
代码】vue $refs validate校验不生效。
【Vue3 + ElementUI】表单校验无效（写法：this.$refs[‘formName‘].validate((valid) =＞{} )）
weixin_47375144的博客
04-09 1922
el-form 中 校验 ，校验无效
vue当中的$refs[formName].validate详解
m0_57840341的博客
12-03 2万+
vue当中的$refs[formName].validate详解 //绑定好组件 <el-form ref="form" :rules="rules" ...> ... <el-form-item ref="name" label="名称:" prop="name"> <el-input v-model="form.name" placeholder="请输入名称"/> </el-form-item>
this.$refs[formName].validate is not a function
ea8d1n3的博客
02-17 7703
本文解决 `for` 循环中对表单进行渲染的问题, 在这种情况下获得表单的方法会得到一个数组而不是对象, 直接使用 `validate` 方法会报错; 另外通过断点调试了一下得到的结果, 发现确实是一个数组对象, 而且数组长度正式被渲染的表单数.
Vue-element中表单自定义校验的this.$refs[formname].validate不生效
HTML5_student的博客
12-20 1万+
今天遇到的问题 在做表单提交的时候，会出现this.$refs[formname].validate方法不生效，通过debug，原来是校验那里出了问题。 在表单规则制定那里我需要自定义校验，用到了validator属性，使用这个的时候要注意一个地方，就是必须要返回一个回调函数。 使用valiator校验规则时，切记一定要返回一个回调函数，使用了if，即使没有else的需求，也要写一个else返回回调函数。否则表单的validate是不会生效的 model : 绑定整个表单model值 rules : 整个表
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值