![](/img/trans.png)
[英]How can I concat a child array to a parent array in a multi level object and many ramifications?
[英]Sorting multi level parent child object in js
我有以下對象數組。 我想對數組進行排序,以便所有子選項都放在其父項旁邊。 大多數解決方案都在樹結構上,我需要它在一個平面結構中。
我還需要一個級別鍵來指示選項的級別。
[
{
"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
},
]
我希望所有孩子都像這樣靠近它的父母
[
{
"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
},
]
我已經看到了一個解決方案,但它只適用於 1 級
你可以試試這個解決方案:
/**
* 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 的結果:
[
{ 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.