递归获取选中/未选中的数据
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>递归获取选中/未选中的数据</title>
</head>
<body>
<div id="root"></div>
</body>
<script>
const data = [{
label: 'Component',
key: '1',
children: [{
label: 'Form',
key: '2',
selectable: false,
children: [{
label: 'Input',
key: '4',
children:[{
label: 'seven',
key: '7',
children:[{
label: 'eight',
key: '8',
children:[{
label: 'nine',
key: '9',
}]
}]
}]
}, {
label: 'Select',
key: '5'
}]
}, {
label: 'Display',
key: '3',
children: [{
label: 'Table',
key: '6'
}]
}]
}];
const keys = [ '3', '5', '6'];
filterCategoryData = (selectKeys, data, type) => {
const newData = [];
data.forEach(item => {
let obj = {};
if (item.children && item.children.length > 0) {
const tempData = this.filterCategoryData(selectKeys, item.children, type);
obj = {
...item,
children: tempData,
};
if (obj.children && obj.children.length > 0) {
newData.push(obj);
}
} else if ( type === "filter" ? !selectKeys.includes(item.key) : selectKeys.includes(item.key)) {
newData.push(item);
}
});
return newData;
}
const newData = filterCategoryData(keys, data, type = "filter");
console.log('newData===', newData);
</script>
</html>