[英]Sorting multi level parent child object in js
I have the following array of objects.我有以下对象数组。 I would like to sort the array so that all child options are placed next to its parent.
我想对数组进行排序,以便所有子选项都放在其父项旁边。 Most of the solutions are on tree structure where I need it in a flat structure.
大多数解决方案都在树结构上,我需要它在一个平面结构中。
Also I need a level key which indicates the level of the option.我还需要一个级别键来指示选项的级别。
[
{
"id": 1,
"name": "Parent"
},
{
"id": 2,
"name": "Child 1",
"parent_id": 1
},
{
"id": 3,
"name": "Grand Child 1",
"parent_id": 2
},
{
"id": 4,
"name": "Grand Child 2",
"parent_id": 2
},
{
"id": 5,
"name": "Child 2",
"parent_id": 1
},
{
"id": 7,
"name": "Grand Child 3",
"parent_id": 2
},
]
I want all child to be places next to it's parent like this我希望所有孩子都像这样靠近它的父母
[
{
"id": 1,
"name": "Parent",
"level": 1
},
{
"id": 2,
"name": "Child 1",
"parent_id": 1,
"level": 2
},
{
"id": 3,
"name": "Grand Child 1",
"parent_id": 2,
"level": 3
},
{
"id": 4,
"name": "Grand Child 2",
"parent_id": 2,
"level": 3
},
{
"id": 7,
"name": "Grand Child 3",
"parent_id": 2,
"level": 3
},
{
"id": 5,
"name": "Child 2",
"parent_id": 1,
"level": 2
},
]
I've seen a solution but it works only 1 level我已经看到了一个解决方案,但它只适用于 1 级
You could try this solution:你可以试试这个解决方案:
/**
* Provided dataset example.
*/
const arrayToBeSorted = [
{ id: 1, name: 'Parent' },
{ id: 2, name: 'Child 1', parent_id: 1 },
{ id: 3, name: 'Grand Child 1', parent_id: 2 },
{ id: 4, name: 'Grand Child 2', parent_id: 2 },
{ id: 5, name: 'Child 2', parent_id: 1 },
{ id: 7, name: 'Grand Child 3', parent_id: 2 }
];
/**
*
* The array is recursively sorted by level, and each element is given the level property.
* @param {Array} list
* @param {Object} parent
* @returns {Array}
*/
const recursiveArraySort = (list, parent = { id: undefined, level: 0 }) => {
let result = [];
/**
* Get every element whose parent_id attribute matches the parent's id.
*/
const children = list.filter(item => item.parent_id === parent.id);
/**
* Set the level based on the parent level for each element identified,
* add them to the result array, then recursively sort the children.
*/
children.forEach(child => {
child.level = parent.level + 1;
result = [...result, child, ...recursiveArraySort(list, child)];
});
return result;
};
const sortedArray = recursiveArraySort(arrayToBeSorted);
console.log(sortedArray);
Console.log's result: Console.log 的结果:
[
{ id: 1, name: 'Parent', level: 1 },
{ id: 2, name: 'Child 1', parent_id: 1, level: 2 },
{ id: 3, name: 'Grand Child 1', parent_id: 2, level: 3 },
{ id: 4, name: 'Grand Child 2', parent_id: 2, level: 3 },
{ id: 7, name: 'Grand Child 3', parent_id: 2, level: 3 },
{ id: 5, name: 'Child 2', parent_id: 1, level: 2 }
]
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.