vue 后端返回一个一维数组 怎样利用递归根据如果公司下面有部门则匹配拿部门code去匹配公司code 如果部门下面还有景区 则拿景区去匹配部门
时间: 2023-08-01 11:06:05 浏览: 118
vue 如何使用递归组件
可以使用递归函数来实现这个需求。具体的思路是,首先找到所有公司的数据,然后对于每个公司,判断是否有部门,如果有部门,则递归调用函数,将部门数据作为参数传入,继续寻找下一级数据(即景区)。如果没有部门,则说明该公司下面没有子级数据,直接返回该公司数据。
下面是一个示例代码,假设数据格式如下:
```javascript
const data = [
{
code: 'C001',
name: '公司1',
children: [
{
code: 'D001',
name: '部门1',
children: [
{
code: 'S001',
name: '景区1'
}
]
},
{
code: 'D002',
name: '部门2',
children: []
}
]
},
{
code: 'C002',
name: '公司2',
children: []
}
];
```
代码实现如下:
```javascript
function findCode(data, code) {
for (let i = 0; i < data.length; i++) {
const item = data[i];
if (item.code === code) {
return item;
}
if (item.children && item.children.length > 0) {
const result = findCode(item.children, code);
if (result) {
return result;
}
}
}
return null;
}
function processCompanyData(data) {
const result = [];
for (let i = 0; i < data.length; i++) {
const company = data[i];
const departments = company.children;
for (let j = 0; j < departments.length; j++) {
const department = departments[j];
const companyCode = company.code;
const departmentCode = department.code;
const departmentCompany = findCode(data, companyCode);
const departmentData = {
code: departmentCode,
name: department.name,
company: departmentCompany
};
if (department.children && department.children.length > 0) {
const scenicAreas = department.children;
for (let k = 0; k < scenicAreas.length; k++) {
const scenicArea = scenicAreas[k];
const scenicAreaCode = scenicArea.code;
const departmentCode = department.code;
const scenicAreaDepartment = findCode(department.children, departmentCode);
const scenicAreaData = {
code: scenicAreaCode,
name: scenicArea.name,
department: scenicAreaDepartment,
company: departmentCompany
};
result.push(scenicAreaData);
}
} else {
result.push(departmentData);
}
}
}
return result;
}
const result = processCompanyData(data);
console.log(result);
```
上述代码中,`findCode` 函数用于根据 code 查找相应的数据,`processCompanyData` 函数是主要的递归函数,它对每个公司的数据进行处理,如果有部门,则递归调用函数,将部门数据作为参数传入,继续寻找下一级数据(即景区)。最终返回一个数组,包含所有部门和景区的数据。
需要注意的是,上述代码中对数据结构进行了一些调整,添加了 `company` 和 `department` 字段,分别表示该部门或景区所属的公司和部门。这样在后续的处理中会更加方便。
阅读全文