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' },],
})
相关推荐
不会敲代码12 小时前
手写 Mini React:从 JSX 到虚拟 DOM 再到 render,搞懂 React 底层原理
前端·javascript·react.js
kyriewen3 小时前
你的代码仓库变成“毛线团”了?Monorepo 用 Turborepo 拆成“乐高积木”
前端·javascript·面试
身如柳絮随风扬3 小时前
你知道什么是 Ajax 吗?—— 从入门到原理,一篇彻底搞懂
前端·ajax·okhttp
旷世奇才李先生3 小时前
Vue3\+TypeScript 2026实战——企业级前端项目架构搭建与性能优化全指南
前端·架构·typescript
Beginner x_u4 小时前
前端八股整理(工程化 02)|CommonJS/ESM、Webpack Loader/Plugin 与Vite 对比
前端·webpack·node.js·plugin·loader
openKaka_4 小时前
createRoot 到底创建了什么:FiberRootNode 和 HostRootFiber 的初始化过程
前端·javascript·react.js
习明然5 小时前
UniApp开发体验感受总结
前端·uni-app
刀法如飞6 小时前
Claude Code Skills 推荐:2026年最值得安装的10个AI技能
前端·后端·ai编程
阿豪只会阿巴6 小时前
【没事学点啥】TurboBlog轻量级个人博客项目——项目介绍
javascript·python·django·html
Lee川6 小时前
面试手写 KeepAlive:React 组件缓存的实现原理
前端·react.js·面试