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' },],
})
相关推荐
ThridTianFuStreet小貂蝉8 分钟前
面试题2、讲一讲JS运行机制、微任务、宏任务、事件循环
javascript
happymaker062627 分钟前
vue中对list的函数处理方式总结,以及常见功能的实现方法
javascript·vue.js·list
还是大剑师兰特28 分钟前
vueup/vue-quill 详细介绍(Vue3 富文本编辑器)
javascript·vue.js·ecmascript
蜡台1 小时前
Uniapp H5Builderx 预览Html 显示404问题解决
前端·uni-app
threelab1 小时前
引擎案例分析 02|GeoLayer 大厂地理可视化方案深度拆解
javascript·3d·webgl
We་ct1 小时前
LeetCode 190. 颠倒二进制位:两种解法详解
前端·算法·leetcode·typescript
踩着两条虫1 小时前
AI驱动的Vue3应用开发平台深入探究(二十五):API与参考之Renderer API 参考
前端·javascript·vue.js·人工智能·低代码·前端框架·ai编程
信创DevOps先锋1 小时前
本土化突围:Gitee如何重新定义企业级项目管理工具价值
前端·gitee·jquery
圣光SG1 小时前
Java类与对象及面向对象基础核心详细笔记
java·前端·数据库