Element 表单验证，只在点击保存按钮时统一验证。输入时忽略验证

最新推荐文章于 2024-05-02 18:44:51 发布
最新推荐文章于 2024-05-02 18:44:51 发布
阅读量3.7k 收藏 4
点赞数 3
分类专栏： element-ui vue 文章标签： vue.js 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/gc_89757/article/details/107810082
版权

使用element的表单验证时候，可能有时我们只想在 点击保存时候统一验证表单，并不需要实时输入验证。我们只需要在 表单中绑定的数据元素上添加： :validate-event="false" 即可。具体如下图

cinoway
关注
  • 3
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
element 结合vue 在表单验证时有值却提示错误的解决办法
08-28
主要介绍了element 结合vue 在表单验证下，有值却提示错误的解决办法,需要的朋友可以参考下
详解element-ui中表单验证的三种方式
10-16
主要介绍了详解element-ui中表单验证的三种方式，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
解决vue+ element ui 表单验证有值但验证失败问题
01-19
一.如图：有值但是验证失败 二. <el model=form rules=rules> <el label=数据模板 prop=template> <el span=20> <el type=textarea v-model=form.template rows=8 placeholder=请输入数据模板 readonly=true></el> </el> </el> </el> export default { data()
vue element自定义表单验证请求后端接口验证
12-30
做vue项目的时候遇到了一个需求，在验证某个表单项时不仅需要是必填项而且要去通过接口校验是否有重复值。 template 引入接口 import { checkUseridRepeat } from '@/api/user' 校验 data: () => { var validateUserid = (rule, value, callback) => { if (v
表单校验规则---小总结
DcTbnk的博客
11-27 723
点击跳往→转载链接 1.普通输入验证 <el-form-item label="活动名称" prop="name"> <!-- validate-event属性的作用是: 输入时不触发表单验证.提交时再验证,你也可以设置成动态验证 --> <el-input v-model="registData.name" :validate-event="false"></el-input> </el-form-item> rule.
elementui from 表单验证 文件验证
芝芝龙的博客
07-26 3077
转发，原文链接：https://www.cnblogs.com/steamed-twisted-roll/p/10167501.html element-ui Form表单验证规则全解 element的form表单非常好用,自带了验证规则,用起来很方便,官网给的案例对于一些普通场景完全没问题,不过一些复杂场景的验证还得自己多看文档摸索,自己经过数次爬坑 之后,总结了几种form表单的验证规则,为了便于阅读,验证规则是拆分的,完整的代码放在文末 1. 普通验证输入 <el-form-item label
Element-UI中的表单验证
ORANGEFISHs的博客
07-02 2190
Element-ui表单验证以及前后端时差问题解决方法
elementUI Form 表单 如何调用时再执行validate校验规则
岳公子
06-21 3113
<el-form-item label="活动名称" prop="name"> <!-- validate-event属性的作用是: 输入时不触发表单验证.提交时再验证,你也可以设置成动态验证 --> <el-input v-model="registData.name" :validate-event="false"></el-input> </el-form-item> rules: { // 表单验证规则 n...
el-input num自定义验证
m0_51347759的博客
01-12 1783
el-input 自定义验证num 行
element form表单validateField对部分表单字段进行校验时触发多次校验
qq_41819868的博客
09-27 3851
element form表单 validateField 对部分表单校验的时候会触发多次
基于element封装公共日期选择器
qq_42360279的博客
01-12 124
基于element封装公共日期选择器
vue 验证input框只能输入正整数
CXX7788的博客
06-19 6250
1.在input框加入事件 @change="validateNum($event)" :validate-event="true" 2.验证方法写在method()里 validateNum(value) { //验证只能填入数字 var reg = /(^([-]?)[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^([-]?)(0){1}$)|(...
elementui一个表单不同情况下的验证规则
qq_41979331的博客
04-15 765
1、页面 HTML： <el-form :model="dataForm" :rules="rulesList" ref="dataForm" v-loading="loading" > <!-- type = '1' 显示 --> <el-row> <el-col :span="22"> <el-form-item label="文本1"
Element-ui表单验证验证失败,input内有内容仍然验证为空的问题,验证数值类型不一致问题
热门推荐
progrmmmm的博客
11-15 1万+
验证的key只能是数组内的某一个key,不能之间验证 格式: html: <el-form :model="nodeName(数组名)" ref="nodeName(数组名)"> <el-form-item prop="name(数组内的属性)" label="内容:" :label-width="formLabelWidth" :rules="[{ required: true, message: '不能为空'}]"> <el-input
element-ui中el-form表单验证，只有点击提交按钮时才进行校验
唐唐唐行的博客
04-04 3233
element-ui中el-form表单验证，只有点击提交按钮时才进行校验
element-ui Form表单验证
嘿嘿
07-25 9630
element-ui Form表单验证规则全解 element的form表单非常好用,自带了验证规则,用起来很方便,官网给的案例对于一些普通场景完全没问题,不过一些复杂场景的验证还得自己多看文档摸索,自己经过数次爬坑 之后,总结了几种form表单的验证规则,为了便于阅读,验证规则是拆分的,完整的代码放在文末 1. 普通输入验证 <el-form-item label="活动名称" prop="name"> <!-- validate-event属性的作用是: 输入
el-input标签类型为数字，结合表单规则验证
wlijun_0808的博客
05-25 584
//data中声明表单规则 rules: { dataAvgMagnitude: [ { validator: this.validateNumber, trigger: 'blur' } ] } //method中声明validateNumber方法 validateNumber(rule, value, callback) { let numberReg = /^\d+$|^\d+[.]?\d+$/ if (value !== ''
自定义表单元素组件内容变化触发ElForm重新校验
最新发布
东逝水
05-02 673
写一个FeeTypeSelector的组件，它的属性大概是这样的// 可选项的数据.......通过接收参数modelValue和触发update:modelValue让FeeTypeSelector组件支持v-model。至此这个组件就大致上写好了。把它放入带有规则的FormItem中，也能正常的校验。不过我今天发现，Element Plus的表单输入组件在有校验错误后再次输入正确的值后校验错误会自动消失，而不需要点击提交按钮调用form.validate方法，而上面的自定义组件就不能。
el-input-number表单验证，设置初始值为空
qq_42764138的博客
08-31 2628
el-input-number

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值