数组嵌套 <el-form><divv-for="version, i in formData.versions"><el-from-item:prop="`versions[${i}].version_name`":rules="formDataRules.version_name"></el-from-item></div></el-form> versions[${i}]要用序号取值的写法,不能直接使用version,el-from-item上的rules的指定也不能省略...
需求:el-form里面el-form-item的数据基本可以重复,可以遍历生成,el-form-item里面有下拉和input,选择某个下拉出现input,某个下拉隐藏input,如下图: 思路:动态生成el-form-item,并在el-form-item绑定校验规则 <el-form ref="stockForm":model="stockForm"class="zd-el-form"size="mini"inline label-width="1...
</el-form-item> <el-form-item label="结束时间:" :prop="'List.'+ index +'.endDate'" :rules="rules.endDate"> <el-input v-model="item.endDate" type="password" /> </el-form-item> <el-form-item label="手机号:" :prop="'List.'+ index +'.phone'" :rules="rules.phone"> <...
嵌套的表单,一般业务场景是,有一些表单项需要按照条件显示或者隐藏,data里面的model数据可能会是对象里面套对象的,el-form也同样支持嵌套的验证,写法一般如下: <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm"> <el-form-item label="活动名称"> <el...
submitForm (formName) { this.$refs[formName].validate((valid) => { if (!valid) return console.log('未通过校验') }) }, addItem () { this.form.activities.push({ name: '', content: '' }) }, removeItem (index) { this.form.activities.splice(index, 1) ...
vue el-form 表单对象里还有对象,多层嵌套校验,制定校验规则,<template><div><el-formref="dataFrom":model="dataFrom":rules="rules"><el-form-itemlabel="用户名"prop="userName"><el-inputv-model="dataFrom.userName"&g
在el-form中正确使用rules校验是非常重要的,rules使用不当容易出现规则不生效、规则一直被触发等各种现象(如错误信息一直提示不得为空)。 下面记录了常见的rules实现方式,以做参考。 1. 在el-form上绑定rules …
element表单中⼀个el-form-item下多个form-item项校验（循环 校验）在+element的项⽬中，需要对form表单下的⼀个form item中校验多项数据，如下图：代码实现（需要注意prop的值）：<div class="send-wrap"> <div class="send-header"> <p class="title">在线下单</p> </div> <el-form :model="...
在form 上定义上绑定 rules 属性, 给需要校验的item 增加prop 属性, prop 值需要个rules中的keys 保持一致
<el-form-item label="考勤周期:" prop="cycleEnd"> {代码...} </el-form-item>data() { {代码...} },