console
let nodeList = [
{ id: '1-1', children: [{ id: '1-2-1' }, { id: '1-2-2' }] },
{ id: '2-1' },
{ id: '3-1', children: [{ id: '3-2-1', children: [{ id: '3-3-1' }] }] }
]
/**********************方式一************************************* */
function filterTree(tree = [], validate = () => { }, param = [], arr = []) {
if (!tree.length) return []
for (let item of tree) {
if (!validate.apply(null, [item, param])) continue
let node = { ...item, children: [] }
arr.push(node)
if (item.children && item.children.length) filterTree(item.children, validate, param, node.children)
}
return arr
}
function validate(node, map) {
console.log("过滤数据2:", node, map)
return map.includes(node.id)
}
let rs = [];
filterTree(nodeList, validate, new Array('1-2-1', '3-1'), rs)
console.log(rs)
/**********************方式二************************************* */
function filter2(nodes, predicate) {
// 如果已经没有节点了，结束递归
if (!(nodes && nodes.length)) {
return [];
}
const newChildren = [];
for (const node of nodes) {
if (predicate(node)) {
// 如果节点符合条件，直接加入新的节点集
newChildren.push(node);
node.children = filter2(node.children, predicate);
} else {
// 如果当前节点不符合条件，递归过滤子节点，
// 把符合条件的子节点提升上来，并入新节点集
newChildren.push(...filter2(node.children, predicate));
}
}
return newChildren;
}
const tree = filter2(nodeList, (node) => new Array('1-2-1', '3-1').includes(node.id));
console.log(tree)
/**********************方式三************************************* */
// 根据传入的值进行数据匹配, 并返回匹配结果
function filterMethod(val, data, filterType) {
return val.includes(data[filterType])
}
/*
* 对表格数据进行处理
* data 为树形数据数组
* filter 为过滤参数即用户输入的值
* filterType 为用户通过什么字段与filter 匹配
*/
function tableFilter(data, filter, filterType) {
const traverse = (data) => {
data.forEach(child => {
console.log("dddddd:",child)
child.visible = this.filterMethod(filter, child, filterType)
if (child.children) traverse(child.children)
if (!child.visible && child.children && child.children.length) {
let visible = !child.children.some(child => child.visible);
child.visible = visible === false;
}
})
}
traverse(data)
return this.filterDataByVisible(data)
}
// 递归过滤符合条件的数据
function filterDataByVisible(data) {
return data.filter(item => {
if (item.children) {
item.children = this.filterDataByVisible(item.children)
}
if (item.visible) {
return true
}
})
}
console.log(tableFilter(nodeList,['1-2-1', '3-1'],"id"))
/**************************************************************** */
//JS树结构操作:查找、遍历、筛选、树结构和列表结构相互转换
//https://blog.csdn.net/OUalen/article/details/131438154
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<script>
const a = [
{
id: 1,
children: {
id: 2,
},
},
{
id: 3,
children: {
id: 4,
children: {
id: 5,
children: {
id: 6,
},
},
},
},
];
function deal(nodes, predicate) {
// 如果已经没有节点了，结束递归
if (!(nodes && nodes.length)) {
return [];
}
const newChildren = [];
for (const node of nodes) {
if (predicate(node)) {
// 如果节点符合条件，直接加入新的节点集
newChildren.push(node);
node.children = deal(node.children, predicate);
} else {
// 如果当前节点不符合条件，递归过滤子节点，
// 把符合条件的子节点提升上来，并入新节点集
newChildren.push(...deal(node.children, predicate));
}
}
return newChildren;
}
console.log("a", JSON.stringify(a));
const result = deal(a, (node) => node.id == 1||node.id == 4);
// console.log(JSON.stringify(result, null, 4));
console.log("result", result);
</script>
</body>
</html>