elementUI 动态校验表单数据的方法

elementUI 动态校验表单数据的方法

直接设置如下

list 为动态获取的数据值列表数据

这里主要设置两块内容 prop为动态数据 rules设置需要校验的值

:prop="list.${index}.title" :rules="rules.title" //title 名称可自己定义

javascript 复制代码
//这里主要设置两块内容 prop为动态数据  rules设置需要校验的值
//:prop="`list.${index}.title`" :rules="rules.title"
<div v-for="(val,index) in list" :key="val">
	<el-form-item label="标题" :prop="`list.${index}.title`" :rules="rules.title">
			<el-select v-model="val.name">
				 <el-option label="名称" value="1"/>
			</el-select>
	</el-form-item>
</div>
//必填校验设置
const rules = reactive({
	title: [{ required: true, message: '请填写', trigger: 'change' },],
})
相关推荐
事圆则缓1 分钟前
Flutter 状态管理框架对比(五):GetX 的响应式、依赖注册与生命周期
前端·javascript·flutter
广州智造1 小时前
Radioss复合材料使用的单元属性
前端·设计·cad·建模·cae·radioss
张宏宇1 小时前
我把微软开源的 tgrep 做成了本地版 GitHub Code Search:45,629 个文件里搜一次 10ms
前端·后端
huakoh1 小时前
MCP 调用超时后别急着重试:三步读回分清执行状态
前端
打工仔折腾 AI1 小时前
把模型切换交给平台:用蓝耘智能路由搭建商品评论分析工具
java·服务器·前端·后端·python·性能优化·ai agent 实战
不可能片场2 小时前
Electron 发布标题的冒号 击穿命令行解析
前端·electron
500842 小时前
React Native for OpenHarmony 实战:三方库 react-native-crypto-js 的鸿蒙化适配指南
javascript·react native·性能优化·electron·harmonyos
reeswell2 小时前
我开源了 inspect-devtools —— 让 AI 终于能"看见"你屏幕上的组件
前端·人工智能
Yuhano2 小时前
W3. 实现Agent工具调用引擎
前端·aigc·ai编程
flash俊杰2 小时前
第三节 基于 Vue 3 的领域模型架构——Schema 驱动的低代码后台实战
前端