若依主子表el-table 校验

若依的主子表

效果如上

1.修改，eltable的绑定数据，由原来的List,改成form.list。将原来绑定的list，放到form{}里。代码中原有的this.list 改成 this.form.list。这一点非常重要，坑了好几天。

<el-table :data="form.brebroodsList" :row-class-name="rowBrebroodsIndex" show-summary@selection-change="handleBrebroodsSelectionChange" ref="brebroods"   highlight-current-row >/** 引种明细表添加按钮操作 */handleAddBrebroods() {let obj = {};obj.brebatchnum = this.form.brebatchnum;obj.houseid = "";obj.malenum = "";obj.femalnum = "";obj.remark = "";this.form.brebroodsList.push(obj);},

总体数据格式必须为

form:{
name:,
desc:,
list:[]
}

2.在原来的input外面套上 <el-form-item...

 <el-form-item :prop="'brebroodsList.' + scope.$index +'.malenum'" :rules="rules.brebroodsList.malenum" label-width="0"  style="margin-bottom: 0;"><el-input-number :controls="false" placeholder="请输入公鸡数" v-model="scope.row.malenum"  /></el-form-item>

此处需注意： :prop="'List名称.' + scope.$index +'.字段名'" Table绑定的：data 必须是form里的，否则报错： "Error: please transfer a valid prop path to form item!"

:rules，可以自己指定rules。为了统一，也嵌套到原来的rules内

        // 表单校验rules: {deptid: [{required: true,message: '请选择部门',trigger: 'change'}],brooddate: [{required: true,message: '请选择引种日期',trigger: 'change'}],breed: [{required: true,message: '请选择品种',trigger: 'change'}],froms: [{required: true,message: '请输入接鸡来源（种禽公司名称）',trigger: 'blur'}],malenum: [{required: true,message: '引种公鸡数',trigger: 'blur'}],femalenum: [{required: true,validator: CheckFeamlNum,trigger: 'blur'}],smalenum: [{required: true,message: '引种公鸡数',trigger: 'blur'}],brebroodsList: {malenum: [{required: true,message: '引种公鸡数',trigger: 'blur'}],houseid: [{required: true,message: '鸡舍号',trigger: 'blur'}],},},

label-width="0" style="margin-bottom: 0;"

必须要设标签宽度为0，否则前面多一点空白
必须要设style，否则加了form-item标签的跟不加的不对齐。

特此记录，坑了好几天。

若依主子表el-table 校验相关推荐

bootstrap table 主子表局部数据刷新（刷新子表）
1.主表中设置data-detail-view="true",启用主子表模式: <table class="table table-striped" wi ...
关于elementui的table主子表展示数据
主子表形式,主表显示汇总信息,子表显示明细,我当时做的第一个版本是主子表展示不同的表格信息,此需求最大的问题是怎么保证主表行点击后展示的是对应的主表行的明细,当然,这个后台做是最方便的,但是当时后台给 ...
批量导入数据到hive表中：假设我有60张主子表如何批量创建导入数据
背景:根据业务需要需要把60张主子表批量入库到hive表. 创建测试数据: 1 def createBatchTestFile(): Unit = { 2 for (layer <- 0 to ...
纸上谈兵: 哈希表 (hash table)
作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! HASH 哈希表(hash table)是从一个集合A到另一个集合B的映射(map ...
EEPlat 主子表和对象引用配置实例
本次实例以常见的订单维护,来介绍下平台内类似主子表结构的配置方法. 订单包含订单头和订单明细.订单头包含简单信息:订单编号.订单状态.客户. 交付日期.订单日期.备注等.订单明细包含:订单产品.定单数 ...
BootStrap-Table主子表
BootStrap-Table主子表效果如下: 实现步骤引js和css <script th:src="@{~/js/bootstrap.js}"></scr ...
Sharding-JDBC主子表（绑定表）关联
目录前言前文什么是绑定表? 创建子表 boot 配置编写功能测试父子表关联查询测试前言主子表关联在我们的开发业务中是及其常见的,本文我们就来看下如何在分库分表的情况下,使用Shardin ...
若依Ruoyi 不分离教程01-新建主子表应用
前提条件本示例是以若依标准版作为演示,前后分离等版本暂未实践. 进行操作前需将本地环境搭建并正常运行. 前言本示例是实现客户管理及联系人管理两个功能,两者关系为主子表,且两者又为单独应用,在客户管 ...
struts表单数据校验
Struts2表单数据校验前台校验也称之为客户端校验,主要是通过JavaScript编程的方式进行表单数据的验证. 后台校验也称之为服务器端校验,这里指的是使用Struts2通过XML配置的方式 ...

若依主子表el-table 校验

若依主子表el-table 校验相关推荐

最新文章

热门文章