//后台返回来的数据形式
const data = {
"code":"0",
"data":[
{
"data":{
"name":"xx集团香港分公司",
isLeaf:false,
"id":1,
"child":{
"name":"xx集团香港分公司第一分部",
isLeaf:false,
"id":2,
"child":{
"name":"xx集团香港分公司第二分部",
isLeaf:false,
"id":3,
"child":{
"name":"xx集团香港分公司第三分部",
isLeaf:false,
"id":4,
"child":{
"name":"xx集团香港分公司第第四分部",
isLeaf:true,
"id":5,
"child":{
//此处省略层数不定 可能根据不同的人的权限层级树不一样 isLeaf为true 代表着在往后已经没有子层级
}
}
}
}
}
}
}
],
"message":"成功"
}
//因为开发中我个人自己开发和使用的控件是数组形式的 后端不小心弄成都是对象形式返回来 因为涉及的业务关联表比较多 不方便改 所以作为前端还得处理,个人处理如下:
预期想达到的数据结构效果:
"data":[
{
"name":"xx集团香港分公司",
isLeaf:false,
"id":2,
"child":[
{
"name":"xx集团香港分公司",
isLeaf:false,
"id":3,
"child":[
{
"name":"xx集团香港分公司",
isLeaf:false,
"id":4,
"child":[
{
"name":"xx集团香港分公司",
isLeaf:true,
"id":5,
child:[{
}]
}
]
}
]
}
]
}
]
//复杂的对象转化成为数组 递归实现
objectToarray(dataObj, arr) {
let newObj = {};
if (Object.prototype.toString.call(dataObj) === "[object Object]") {
for (let i in dataObj) {
newObj[i] =
i === "child" && !dataObj.isLeaf
? this.objectToarray(dataObj[i], [])
: dataObj[i];
}
arr.push(newObj);
}
return arr;
}
//取到数据和将数据塞进去进行处理 静静等待结果
const dataObj = data.data[0].data;
const result = objectToarray(dataObj , [])