element ui from 表单添加必填的星号但是不进行校验

最新推荐文章于 2025-04-18 15:50:06 发布
原创 最新推荐文章于 2025-04-18 15:50:06 发布 · 6k 阅读 · 16 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript #前端 #vue.js

本文介绍两种在Element UI框架中设置表单项为必填的方法：一是通过添加required属性实现验证功能；二是通过添加特定样式类实现视觉提示，但不影响实际验证逻辑。

方法1：
在 el-form-item 上添加 required 或 :required=“true” 并去掉 prop 属性
但这种方法有时会无效（无效原因不知道）

<el-form-item label="测试" :required="true">
  这是测试代码
</el-form-item>

在这里插入图片描述
方法2：
在 el-form-item 上添加 class=“is-required”
这种办法原理只是修改样式，跟功能无关

<el-form-item label="测试" class="is-required">
  这是测试代码
</el-form-item>

在这里插入图片描述

antd 2.2.8 版本 Form表单使用useForm带星号校验和带星号不校验的写法以及不带星号不校验的写法
agua001的博客
04-11 5308
antd 2.2.8 版本 Form表单使用useForm带星号校验和带星号不校验的写法以及不带星号不校验的写法
elementUI表单不显示星号
文龙刚的博客
12-28 3501
elementUI表单不显示星号
elementui form必填项显示红色星号但不触发校验
小猫爪子
05-27 6804
封装的form组件 父组件传rules,必填项显示红色星号但不触发校验 dataForm和表单加载item对应项必须相同，我一开始顺序ip和datasource顺序写反了 × dataForm: { ip: '', datasource: '', port: '', username: '', password: '', databaseName: '', version: '' }, √ dataForm: { datasource: '', ip: '', port: '',
如何给element的el-table的表头的添加必填*的标识
张张张的博客
10-14 4897
在你需要添加标识的的标签上添加render-header方法。
给element from表单前面添加必填的星号但不触发校验
qq_46154004的博客
05-15 2121
第二步：在打开表单页面时调用changeRequired(false）， 给form表单赋值完成以后清空校验结果即可 （场景：在保存时只校验某些项，打开保存的表单后，提交时需要的所有校验项没填的都要显示红星。比如保存时，只有这四个需要校验，则调用 changeRequired(true)只要打开界面添加该类的项就会显示红星，但是不会校验（校验功能需要另外写）提交时，全部项都要校验，调用changeRequired(false）第一步：先写一个功能，可以自行设置rules规则里项是否进行校验。
elementui el-form-item标签 label前加红色星号且不校验必填
m0_53682699的博客
12-15 4624
刚开始，我直接在该el-form-item标签上加 required 来获取红色星号。如何避开required且顺利加上红色星号呢？有两种方式：1、在该el-form-item标签上加一个class=“is-required”即可。2、在label下加label设置项。需求：需要在el-form-item标签 label前加红色星号，但不需要校验该字段。
详解element-ui设置下拉选择切换必填和非必填
12-10
如果选择“非必填”，则不进行校验且隐藏星号。问题在于，Element-UI的默认行为是在组件初始化时就确定了校验规则，动态切换`rules`对象的`required`属性无效。 为了解决这个问题，我们可以采取以下步骤： 1. **...
模仿element-ui的表单校验星号 css写一个
04-02
嗯，用户想知道怎么用CSS实现Element-UI表单校验中必填项的红色星号效果。首先，我得回忆一下Element-UI的表单结构。通常，必填项的星号是在表单项的标签前面加上一个红色的小星号。这可能涉及到CSS的伪元素，比如::...
element ui form表单校验 红心
09-13
Element UI的表单校验功能可以通过设置规则属性和prop属性来实现。在Form组件中，可以通过rules属性传入约定的验证规则，并将Form-Item的prop属性设置为需要校验的字段名。 例如，如果想要实现在活动名称输入框中...
【ElementUI 表单校验】一个 el-form-item 下多个表单校验（循环校验）
前端知识分享喵
06-07 4710
前端开发项目的过程中，批量表单循环校验是很常见的，如上图，动态添加奖励计算规则，把所有的表单放到了一个 el-form-item 下。也可以理解为 el-form-item 做了嵌套，外层当然也可以省略，样式做微调，下面通过代码来详细的看一下。不足之处，多多交流。
Element el-form-item标签加小红星但不校验内容
m0_63788547的博客
12-06 898
Element el-form-item标签加小红星但不校验内容
关于ElementUI表单校验时必填项按照校验规则输入但一直校验不通过问题解决
cabinx的博客
10-09 6021
关于ElementUI表单校验时必填项按照校验规则输入但一直校验不通过问题解决 1.问题描述： vue项目中使用ElementUI的表单form校验单的时候，按照校验规则进行输入，但是一直校验不通过，问题如下图： 2.解决方案： 出现上述问题的根本原因竟然是：v-model与:model的区别问题（v-model： 通常用于input的双向数据绑定，但它并不会向子组件传递数据。:model： 表示绑定自定义属性，它只是将父组件的数据传递给子组件，但没有实现父组件和子组件数据之间的双向
vue+elementui 的表单希望添加必填的星号，但是不校验。css加星号
最新发布
肖肖肖丽珠的博客
04-18 208
el-form-item label="户籍地址" class="xjd"></el-form-item>直接css给他加星号。
element form表单label前面加红星，但是不验证
u013361179的博客
05-26 3504
element form表单label前面加红星，但是不验证
element ui form表单项显隐，校验（不该）触发问题
zhl_cafe的博客
09-07 3693
element ui form表单项显隐，校验（不该）触发问题。
vue element-ui 进行表单校验时自定义校验规则 没有小星星，显示英文校验提示
ClamJ092的博客
11-22 9214
之前遇到了一个小问题，就是要自定义校验规则，但是加上了自定义校验规则之后，左上角的小红星星不显示了，按照网上的说法在element ui 元素上加了required，又遇到了新问题，在输入数据，一点一点删掉之后，下边的提示竟然出现了校验默认的英文。 直接上正确代码，再总结问题 <el-form-item label="软件名称" prop="softwareName"> ...
element 表单设置不触发验证
zhangtongxueya的博客
05-09 2357
首先说一下本人遇到的问题： 有一项表单验证是选择用户，但是里面还有input 用于筛选，但是input 失去焦点，或者是发送改变都出触发表单验证 解决：只要给不需要进行验证的标签加上:validate-event="false" ...
el-form 表单项前面显示星号 但又不校验这一项代码怎么实现
killerdoubie的博客
06-19 2166
el-form 表单项前面显示星号 但又不校验这一项代码怎么实现
给element表单添加必填*星号的方法
热门推荐
肖肖肖丽珠的博客
07-23 3万+
1，利用rules 属性传入约定的验证规则，并将 Form-Item 的 prop 属性设置为需校验的字段名即可。 <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm"> <el-form-item label="活动名称" prop="name"> <el-input v-model="ruleForm.name"&g....
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值