[ {  "componentCount": 5,  "categories": [    {      "componentCount": 5,      "elements": [        {          "newName": "Generic - 200mm",          "oldComponentKey": "M1697679454017_144344",          "oldName": "Generic - 200mm",          "newComponentKey": "M1697680099315_144344",          "type": "attribute"        },        {          "newName": "Interior - 138mm Partition (1-hr)",          "oldComponentKey": "M1697679454017_143858",          "oldName": "Interior - 138mm Partition (1-hr)",          "newComponentKey": "M1697680099315_143858",          "type": "geometry"        },        {          "newName": "Generic - 200mm",          "oldComponentKey": "M1697679454017_154279",          "oldName": "Generic - 200mm",          "newComponentKey": "M1697680099315_154279",          "type": "both"        },        {          "newName": "Generic - 200mm",          "oldComponentKey": "M1697679454017_150861",          "oldName": "Generic - 200mm",          "newComponentKey": "M1697680099315_150861",          "type": "attribute"        },        {          "newName": "Generic - 200mm",          "oldComponentKey": "M1697679454017_151331",          "oldName": "Generic - 200mm",          "newComponentKey": "M1697680099315_151331",          "type": "attribute"        }      ],
      "categoryName": "墙"
    }
  ]
}
]

这个是我们将数据展示成这样 截屏2023-10-24 14.11.16.png

这是我们的数据结构

[{	"id": 0,	"label": "全部",	"children": [{		"label": "屋顶",		"componentCount": 1,		"componentKey": "",		"id": 1,		"children": [{			"label": "对比组",			"id": 1,			"children": [{				"label": "新Concrete Deck - Tapered Insulation",				"id": "M1598257565598_1400561",				"componentKey": "新M1598257565598_140056",				"type": "new"			}, {				"label": "旧Concrete Deck - Tapered Insulation",				"id": "M1608039229034_1400561",				"componentKey": "新M1608039229034_140056",				"type": "old"			}]
		}]
	}, {
		"label": "模型组",
		"componentCount": 2,
		"componentKey": "",
		"id": 2,
		"children": [{
				"label": "对比组",
				"id": 2,
				"children": [{
					"label": "新Array Group 1",
					"id": "M1598257565598_1328311",
					"componentKey": "新M1598257565598_132831",
					"type": "new"
				}, {
					"label": "旧Array Group 1",
					"id": "M1608039229034_1328311",
					"componentKey": "新M1608039229034_132831",
					"type": "old"
				}]
			},
			{
				"label": "对比组2",
				"id": 3,
				"children": [{
					"label": "新Array Group 1",
					"id": "M1598257565598_1328311",
					"componentKey": "新M1598257565598_132831",
					"type": "new"
				}, {
					"label": "旧Array Group 1",
					"id": "M1608039229034_1328311",
					"componentKey": "新M1608039229034_132831",
					"type": "old"
				}]
			}


		]
	}]
}]

  componentList.changDataList = [{
    id: 0,
    label: "全部",
    children: [...changeDataChenged(res.data.data.changed.categories)]
  }]
  
const changeDataChenged = (data: any) => {
  return  data.map((item: any, index: number) => {
      return {
        label: item.categoryName ,
        componentCount: item.componentCount ? item.componentCount : 1,
        componentKey: item.componentKey ? item.componentKey : '',
        id: item.componentKey ? item.componentKey : index + 1,
        children: item.elements.length>0 ? item.elements.map((el:any,ind:any)=>{
          return {
          label: '对比组'+(ind+1),
          id: item.componentKey ? item.componentKey : index + 1,
          children: [
            {
              label: '新' +el.newName,
              id: el.newComponentKey + 1,
              componentKey: '新' + el.newComponentKey,
              type: "new"
            },
            {
              label: '旧' + el.oldName,
              id: el.oldComponentKey + 1,
              componentKey: '旧' + el.oldComponentKey,
              type: "old"
            }
          ]
        }
        }) : []
      }
  })
}

posted on 2023-10-24 15:30  awite  阅读(18)  评论(0编辑  收藏  举报  来源