element - - - - - form表单rules初始化校验飙红？

最新推荐文章于 2023-06-05 09:24:45 发布
最新推荐文章于 2023-06-05 09:24:45 发布
阅读量1.6k 收藏 2
点赞数 1
分类专栏： elementUI 文章标签： element-ui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Dark_programmer/article/details/129494689
版权

1. 通过form组件属性配置解决

通过form组件属性配置解决（validate-on-rule-change=“false”）

在这里插入图片描述

<el-form ref="ruleFormDom" class="formDom" :model="ruleForm" :rules="rules" label-width="180px" :validate-on-rule-change="false">
   <el-form-item label="起止日期">
    	<el-input value='ruleForm.valueÏ'/>
    </el-form-item>
  </el-form>

2. 通过js清空校验结果

在这里插入图片描述

this.$refs.ruleForm.clearValidate()
Dark_programmer
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue element-ui父组件控制子组件的表单校验操作
10-15
子组件接收`addForm`作为props，用于初始化表单模型。在子组件内部，我们创建了一个`el-form`并绑定了`addForm`，同时设置了表单验证规则（`formRules`）。每个`el-form-item`都有一个`prop`属性，它应该与`v-model`...
【Element】el-form表单初始化，一进页面就校验就报红提示
最新发布
weixin_45041493的博客
08-23 807
elementui中的表单验证问题，一进入表单也就进行表单验证如何取消
【Element】el-form表单初始化，校验就报红提示
weixin_43951592的博客
09-01 2725
element表单
vue element ui From表单校验 关闭模态框 重新打开 还存在标红校验
奔跑吧代码
11-17 3559
vue element ui From表单校验 关闭模态框 重新打开 重置表单解决标红校验 仅供参考 自我记录. 解决方案① 在关闭模态框是 调用this.$refs.ruleForm.resetFields()重置表单 collectPigeonConfigClose(){ this.collectPigeonConfigVisible = false // this.$nextTick(()=>{ this.$refs.ruleForm.resetF
element-ui表单初始化校验报红
qq_45256497的博客
09-07 2551
在开发中，我们经常会遇到element-ui表单回显，初始化页面就报红的情况。在回显赋值的时候，加上以下代码就好啦。
element中form校验问题，当点击修改之后，关闭弹出框进行新增，就会出现字段不能为空的情况爆红问题解决
weixin_45926180的博客
06-05 1300
element修改后再新增 爆红问题
elment-ui表单初始化校验报红提示
weixin_45536426的博客
11-22 967
欢迎使用Markdown编辑器 你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。 新的改变 我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，帮助你用它写博客： 全新的界面设计 ，将会带来全新的写作体验； 在创作中心设置你喜爱的代码高亮样式，Markdown 将代码片显示选择的高亮样式 进行展示； 增加了 图片
使用element-ui +Vue 解决 table 里包含表单验证的问题
09-16
为了在表格初始化时设置数据，可以使用`mounted`生命周期钩子来填充`domains`数组。之后，使用`this.$set`方法将`domains`数组赋值给`fromData`的`domains`属性，这样`el-form`就能识别到表格中的数据。 提交表单时...
详解element-ui设置下拉选择切换必填和非必填
12-10
问题在于，Element-UI的默认行为是在组件初始化时就确定了校验规则，动态切换`rules`对象的`required`属性无效。 为了解决这个问题，我们可以采取以下步骤： 1. **移除动态校验字段的规则**：首先从`rules`对象中...
基于VueElementUI快速创建生成表单进行数据校验获取表单数据
08-10
在`mounted`钩子中，我们根据`formFields`数组生成了`formData`对象和`rules`对象，使得表单能够自动渲染并进行数据校验。 获取表单数据非常简单，只需在Vue实例上使用`this.$refs`访问到表单的引用，然后调用`...
ElementUI多个子组件表单的校验管理实现
10-16
在 PersonForm.vue 文件中，我们创建了一个 PersonForm 类来初始化表单数据，并定义了一个 static 方法 `getRule` 来生成校验规则。这些规则遵循 ElementUI 的验证规则格式，如使用 `validator` 函数和 `trigger` ...
ElementUI表单验证 错误提示不消失原因（最全面，一次解决）
weixin_46463341的博客
10-18 9354
ElementUI表单验证 错误提示不消失原因（最全面，一次解决）
element ui 表单确认提示红色，取消提示方法
宁夏前端工程师，马卫斌，wx：1457508895
01-29 1881
element ui 表单确认提示红色，取消提示方法
【无标题】
xiaoyugan000的博客
03-17 306
今天跟朋友解决问题，获取接口数据需要将文本框内容及radio的value传递过去，发现用v-model数据绑定的方式很高效，在此记录，供个人日后参考。 element-ui 安装，点此链接：组件 | Elementhttps://element.eleme.cn/#/zh-CN/component/quickstart 要求是点击提交按钮把这三个参数（下拉框，文本框，单选钮）带过去 代码如下，三个都可以通过v-model将值存在ruleForm中，最后在接口里把ruleForm传过去就好。 ..
ElementUI form校验填入了数据仍红色提示输入
TarkuNi的博客
05-25 1608
如下图，经纬度明明有值了，点击确定提交仍然会提示经纬度缺失，我甚至在点击确定按钮的方法里打印form绑定数据（:model="editData"），打印的数据中经纬度绑定的数据也是有的，比较特别的是我的经纬度是我点击地图自动带出来的，不是手输的，查了好久都解决不了，直到一个大神提示说，是不是新增时，父组件传过来的参数即form绑定的editData没有经纬度绑定的lat和lng？
三分钟细数 el-form 表单校验的坑点，前车之鉴，可助你避坑
热门推荐
本博客纯属个人网络笔记，如对阁下有用，甚喜；否则，关掉即可，不喜勿喷。专心写代码，不做键盘侠！
10-12 1万+
Vue 的 el-form 提供了表单校验功能，通过 :rules 属性设置校验规则，并通过 el-form-item 的 prop 属性绑定校验规则。通过封装，让前端校验更方便。具体使用过程中，有几个容易出错的地方，本文来整理一下。每一个坑都是笔者亲自趟过的，写完本文后，以后应该不会再踏入相同的坑。...
vue element-ui中有关表格中的数据整条显示红色/绿色等等颜色的问题
九七的博客
02-22 2108
【代码】vue element-ui中有关表格中的数据整条显示红色/绿色等等颜色的问题。
element ui 红点_element-ui的表单验证配合其他组件使用（wangEditor），显示出element表单验证的必填小红点...
weixin_39580041的博客
12-22 1322
在使用element-ui开发的时候，总感觉element-ui的组件不够用，这个时候总会需要配合其他的单独的组件来使用。这一次我就用到了富文本，然而element-ui中并没有富文本组件，而且是用在表单中，需要进行表单验证(就是简单的验证是否为空)。wangEditor安装、引入以及创建编辑器安装wangeditornpm install wangeditor引入、创建编辑器import Edi...
解决彻底element表单报红问题
qq_26889291的博客
10-14 763
element 表单赋值时红色提示
快速搭建Vue前端项目：vue-element-admin实践
- **main.js**: 入口文件，初始化Vue实例和组件。 - **permission.js**: 权限管理逻辑。 - **setting.js**: 设置文件，包括全局配置。 - **tests**: 测试文件夹，用于单元测试和集成测试。 - **.env.xxx**: ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值