Background: The data structure of the interface is similar to this. The
real data returned by the backend is as follows: This is a four-level structure that needs to be rendered, and the fourth level only needs to get the name of each level and the ID
of the first level.
The most stupid way to analyze layer by layer and then render
// 处理渲染左侧菜单的渲染
const outinner = result.dbcFiles;
let allData = [];
for (let i in outinner) {
let str = Object.keys(outinner).toString();
var index1 = str.lastIndexOf('.');
var index2 = str.length;
if (index1 >= 1) {
str = str.substring(index1, index2);
}
// 如果得到的后缀命为arxml需要四层的渲染结构
if (str === '.arxml') {
let empty = true;
let i1Item = {
};
i1Item.name = i;
let i1List = [];
for (let j in outinner[i]) {
empty = false;
let i2Item = {
};
let i2List = [];
i1Item.dbcId = outinner[i].dbcId;
i2Item.name = j;
const temp = outinner[i][j] || {
};
if (temp.length > 0) {
temp.map((i3) => {
let i3Item = {
};
let i3List = [];
i3Item.name = i3.name;
i2List.push(i3Item);
const signal = i3.signals || [];
signal.map((i4) => {
let i4Item = {
};
i4Item.label = i4.name;
i4Item.value = i4.name;
i3List.push(i4Item);
});
i3Item.i3List = i3List;
});
i2Item.i2List = i2List;
i1List.push(i2Item);
}
}
if (!empty) {
i1Item.i1List = i1List;
allData.push(i1Item);
}
} else if (str === '.dbc') {
}
console.log(allData);