// 树形结构
let arrTree=[
{
"id": "1172544720060223488",
"pid": "0",
"name": "测试数据",
"pname": null,
"isFill": 0,
"remark": "",
"formId": null,
"children": [
{
"id": "1175119820747902976",
"pid": "1172544720060223488",
"name": "1-1",
"pname": "测试数据",
"isFill": 0,
"remark": "-",
"formId": null,
"children": [
{
"id": "1175119936229675008",
"pid": "1175119820747902976",
"name": "1-1-1",
"pname": "1-1",
"isFill": 0,
"remark": "-",
"formId": null,
"children": [
{
"id": "1175120124839137280",
"pid": "1175119936229675008",
"name": "1-1-1-1",
"pname": "1-1-1",
"isFill": 1,
"remark": "-",
"formId": "1171463498387099648",
"children": []
}
]
},
{
"id": "1175119974544642048",
"pid": "1175119820747902976",
"name": "1-1-2",
"pname": "1-1",
"isFill": 0,
"remark": "-",
"formId": null,
"children": [
{
"id": "1175120197488676864",
"pid": "1175119974544642048",
"name": "1-1-2-1",
"pname": "1-1-2",
"isFill": 1,
"remark": "-",
"formId": "1171463498387099648",
"children": []
}
]
}
]
},
{
"id": "1175119860837060608",
"pid": "1172544720060223488",
"name": "1-2",
"pname": "测试数据",
"isFill": 0,
"remark": "-",
"formId": null,
"children": []
},
{
"id": "1175119896216014848",
"pid": "1172544720060223488",
"name": "1-3",
"pname": "测试数据",
"isFill": 0,
"remark": "-",
"formId": null,
"children": []
}
]
}
]
使用递归方法将树形数据扁平化并提取对象
flattenTree (data) {
console.log(data)
const flattened = []
for (const item of data) {
flattened.push(item)
if (item.children && item.children.length > 0) {
flattened.push(...this.flattenTree(item.children))
}
}
return flattened
},
执行扁平化操作并将结果赋值给flattenedData
this.flattenedData = this.flattenTree(arrTree)
处理后效果
还有一种方法,不太推荐
flatTen (data) {
return data.reduce((prev, cur) => {
prev.push({ id: cur.id, name: cur.name, formId: cur.formId, isFill: cur.isFill, pid: cur.pid, pname: cur.pname, remark: cur.remark })
if (cur.children) {
prev.push(...this.flatTen(cur.children))
}
return prev
}, [])
},
- 输入数据结构与函数预期的不匹配。例如,如果
data
不是一个数组,或者数组中的元素不包含id
、name
、formId
、isFill
、pid
、pname
、remark
这些属性,那么函数就会出错。 - 内存问题。如果你的数据结构非常大,可能会超出JavaScript引擎的内存限制。