1、场景:
因为后台返回的路由是分模块的,而产品的需求是想要都作为一级展示:
后台返回数据的展示结构:
产品需要的展示结构:
2、数据
后台返回的数据格式是下面这种格式:
data:[{
name: "账号权限",
maxSort: 3,
childRights: [{
id: 6,
rightName: "用户管理",
rightParent: "账号权限",
rightUrl: "user",
sort: 3,
gmtCreated: "2022-05-25T07:12:52.000+00:00",
isDeleted: 0
}, {
id: 7,
rightName: "角色管理",
rightParent: "账号权限",
rightUrl: "role",
sort: 3,
gmtCreated: "2022-05-25T07:12:54.000+00:00",
isDeleted: 0
}]
},
{
name: "系统管理",
maxSort: 4,
childRights: [{
id: 8,
rightName: "站点管理",
rightParent: "系统管理",
rightUrl: "site",
sort: 4,
gmtCreated: "2022-05-25T07:12:58.000+00:00",
isDeleted: 0
}]
}
]
而我要转成以下这种格式:
data:[{
id: 6,
rightName: "用户管理",
rightParent: "账号权限",
rightUrl: "user",
sort: 3,
gmtCreated: "2022-05-25T07:12:52.000+00:00",
isDeleted: 0
}, {
id: 7,
rightName: "角色管理",
rightParent: "账号权限",
rightUrl: "role",
sort: 3,
gmtCreated: "2022-05-25T07:12:54.000+00:00",
isDeleted: 0
},{
id: 8,
rightName: "站点管理",
rightParent: "系统管理",
rightUrl: "site",
sort: 4,
gmtCreated: "2022-05-25T07:12:58.000+00:00",
isDeleted: 0
}
]
3、方法
使用的是递归的思想,代码如下:
<script>
let arr = [{
name: "账号权限",
maxSort: 3,
childRights: [{
id: 6,
rightName: "用户管理",
rightParent: "账号权限",
rightUrl: "user",
sort: 3,
gmtCreated: "2022-05-25T07:12:52.000+00:00",
isDeleted: 0
}, {
id: 7,
rightName: "角色管理",
rightParent: "账号权限",
rightUrl: "role",
sort: 3,
gmtCreated: "2022-05-25T07:12:54.000+00:00",
isDeleted: 0
}]
},
{
name: "系统管理",
maxSort: 4,
childRights: [{
id: 8,
rightName: "站点管理",
rightParent: "系统管理",
rightUrl: "site",
sort: 4,
gmtCreated: "2022-05-25T07:12:58.000+00:00",
isDeleted: 0
}]
}
]
let arrTeap = []
function mergeArr(obj) {
if (obj.childRights.childRights) {
mergeArr(obj.childRights)
} else {
for (let k = 0; k < obj.childRights.length; k++) {
arrTeap.push(obj.childRights[k])
}
}
}
for (let i = 0; i < arr.length; i++) {
mergeArr(arr[i])
}
console.log(arrTeap)
</script>