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 分钟前
一个基于 .NET + Vue 实现的通用权限管理平台(RBAC模式),前后端分离模式,开箱即用!
前端·vue.js·c#·.net·.net core
Aotman_3 分钟前
Vue el-table 表尾合计行
前端·javascript·vue.js·elementui·前端框架·ecmascript
编程猪猪侠6 分钟前
Vue3 + Ant Design Vue 实现 Table 表格嵌套 Radio 单选框
javascript·vue.js·anti-design-vue
静小谢10 分钟前
vue3实现语言切换vue-i18n
前端·javascript·vue.js
Highcharts.js11 分钟前
如何使用Highcharts Flutter的官方使用文档
javascript·flutter·开发文档·highcharts
东东51614 分钟前
资产管理信息系统ssm+vue
前端·javascript·vue.js
森爱。16 分钟前
web开发全家桶(django+前端+数据库)
前端·python·django
骆驼爱记录19 分钟前
Word侧边页码设置全攻略
前端·自动化·word·excel·wps·新人首发
利刃大大23 分钟前
【Vue】声明式导航与传参 && 编程式导航与传参 && 嵌套与守卫
javascript·vue.js·ecmascript
方安乐29 分钟前
react笔记之useCallback/useEffect闭包陷阱
前端·笔记·react.js