一开始是使用数组的遍历方式(forEach)
export function tranListTotreedata(list, id) {
let arr = [];
list.forEach((item) => {
if (item.pid === id) {
const children = tranListTotreedata(list, item.id);
if (children.length) {
item.children = children;
}
arr.push(item);
}
});
return arr;
}
但其中有一个问题是,当筛选出根数据时,这些数据时不需要再次遍历的,首先想到的是使用splice将以筛选的数据删除
export function tranListTotreedata(list, id) {
let arr = [];
list.forEach((item,i) => {
if (item.pid === id) {
list.splice(i,1)
const children = tranListTotreedata(list, item.id);
if (children.length) {
item.children = children;
}
arr.push(item);
}
});
return arr;
}
发现数据虽然已经转换为树形结构,但是有部分数据丢失,这是很严重的bug,调试,发现数据删除时,后面的数据会补上,导致索引混乱了,原来3的变成2了,而数据还是从3开始。所以一部分数据就没有被筛选
办法就是用原生的for循环了
export function transListToTreeData(list, id) {
var arr = []
for (let i = 0; i < list.length; i++) {
const item = list[i]
if (item.pid === id) {
list.splice(i, 1)
i--
const children = transListToTreeData(list, item.id)
if (children.length) {
item.children = children
}
arr.push(item) // 把节点push到数组里面
}
}
return arr
}
经过测试循环减少一半。
对于日常中的问题,进行总计和归纳,每天进步一点。