处理动态表格数据

let arr = [{formName:'测试',formArr:'666',childList:[{test:'李立明',test1:"支持"},{test:"张毅",test1:"不支持"}]},{formName:'测试1',formArr:'999',childList:[{test:'李维',test1:"支持"},{test:"张毅",test1:"不支持"}]},{formName:'测试',formArr:'666',childList:[{test:'李立明',test1:"支持"},{test:"李伟",test1:"不支持"}]}];

//去重处理表头数据
let tableHead = [];let tableHeadList = [];let tableHeadObj = {};let tableList = [];let headNameList = [];
arr.forEach(item => {
 tableList = Object.keys(item);
  if(Array.isArray(tableList) && tableList.length > 0){
       tableList.forEach(ele => {
       if(ele !== 'childList') headNameList.push(ele);
        })
    }
  if(Array.isArray(item.childList) && item.childList.length > 0){
     tableHead.push(item);
        item.childList.forEach(ele => {
            headNameList.push(ele.test)
        })
    }
});
// 准备prop的值
let newObj = new Set(headNameList);
let newArr = [...newObj];
console.log(newArr);

// ----------------

// 准备表头参数
let tableParamList = [];let tableParamObj = {};
newArr.forEach(item => {
tableParamObj = {}
tableParamObj.lable = item;
tableParamObj.prop = item;
tableParamList.push(tableParamObj);
})
console.log("打印表头数据",tableParamList);
console.log("---------------------------")

// 表头处理好再处理表格数据
let tableFromList1 = [];let tableFormObj = {};
arr.forEach(item => {
 tableFormObj = {};
 tableFormObj.formName = item.formName;
tableFormObj.formArr = item.formArr;
  if(Array.isArray(item.childList) && item.childList.length > 0){
        item.childList.forEach(ele => {
            console.log();
            tableFormObj[ele.test] = ele.test1
            tableFromList1.push(tableFormObj)
        })
    }
});
// 表格数据
console.log(tableFromList1);

 处理动态表单思路,理论上动态表格数据应该是后台返回表头数据和表格数据,应该要求后台返回处理结果数据
 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值