//1.初始化的时候要设置为一个空的数组editData:{headImageUrl:'',nickName:'',studentNumber:null,sex:null,dateOfBirth:'',ilicenseNo:'',nation:null,appointmentTime:null,politicsStatus:null,nativePlace:null,gradeClass:[]};//2.自定义写rules<el-form-itemlabel="年级班级"prop="gradeClass":rules=...
上代码 用的循环el-form, :model绑定循环的item,也就是数组中的单个对象,然后prop绑定参数,rules正常写, 然后提交的时候,因为el-form是循环的,所以用ref绑定的fForm是一个数组,要循环校验 fForm.value.forEach((item:any) =>{ item.validate((vali:boolean) =>{if(vali){// 校验通过} }) }) 这样就能...
需求: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...
1.只有一条时,el-from-item 的属性rules绑定的变量的值为一个对象,对象中规定验证规则 2.有多条时,el-from-item 的属性rules绑定的变量的值为一个对象数组,数组中的每一个对象元素都对应一条验证规则
通过自己多方面测试，终于了解到了el-form-item也有rules属性的用法，现在总结分享给大家！表单域的验证规则： 1.只有一条时，el-from-item 的属性rules绑定的变量的值为一个对象，对象中规定验证规则 2.有多条时，el-from-...
Vue 的 el-form 提供了表单校验功能,:rules属性设置校验规则,并通过 el-form-item 的 prop 属性绑定校验规则。组件封装,让前端校验更方便。 具体使用过程中,有几个容易出错的地方,本文来整理一下。每一个坑都是笔者亲自趟过的,写完本文后,以后应该不会再踏入相同的坑。
-- el-form重点双重嵌套, model绑定的是item,也就是array下的每一项,规则是新的, 因为是多个el-form,所以这里的itemRef是数组,验证规则请看methods --> <el-form :model="item" :rules="itemRules" ref="itemRef"> <!-- prop绑定的是array下每一项的key值 --> <el-form-item prop="go"> <el-...
通过循环中的index来确定peop的绑定值,通过数组字段的拼接来实现代码如下 <div v-for="(item,i) in inRoomsData"> <el-form-item :prop="'inRoomsData.' + i + '.floorNum'" label="楼层" :rules="[{ required: true }]" style="display:inline-block"> <el-input size="small" v-model="item...
form-item模块的属性 ElementUI表单 el的表单官网内容很多,看了一眼觉得心累了。但实际上它使用起来非常的方便,el为我们封装了各种组件,样式也大众。 一个简单的案例 代码如下(使用时确保引入了相关的组件) <template> <el-form ref="form" :model="form" label-width="80px"> ...