by Guest » 05 Jan 2025, 14:08
Ich möchte eine einfache Abfrage in Hierarchie-JSON formatieren, um sie im Front-End anzuzeigen, aber ich weiß nicht, wie
Ich habe möglicherweise eine relationale Datenbank mit einer Tabelle namens „Todo“. folgende Spalte
zum Beispiel
Code: Select all
[
{id: 2, Name:"Task 1.1", ParentID: 1},
{id: 5, Name:"Task 2", ParentID: null},
{id: 6, Name:"Task 2.1", ParentID: 5},
{id: 1, Name:"Task 1", ParentID: null},
{id: 3, Name:"Task 1.2", ParentID: 1},
{id: 4, Name:"Task 1.3", ParentID: 1},
{id: 7, Name:"Task 2.2", ParentID: 5},
{id: 8, Name:"Task 2.3", ParentID: 5},
{id: 9, Name:"Task 3", ParentID: null}
]
bis
Code: Select all
[
{
"id": 5,
"Name": "Task 2",
"ParentID": null,
"subtasks": [
{
"id": 6,
"Name": "Task 2.1",
"ParentID": 5,
"subtasks": []
},
{
"id": 7,
"Name": "Task 2.2",
"ParentID": 5,
"subtasks": []
},
{
"id": 8,
"Name": "Task 2.3",
"ParentID": 5,
"subtasks": []
}
]
},
{
"id": 1,
"Name": "Task 1",
"ParentID": null,
"subtasks": [
{
"id": 2,
"Name": "Task 1.1",
"ParentID": 1,
"subtasks": []
},
{
"id": 3,
"Name": "Task 1.2",
"ParentID": 1,
"subtasks": []
},
{
"id": 4,
"Name": "Task 1.3",
"ParentID": 1,
"subtasks": []
}
]
},
{
"id": 9,
"Name": "Task 3",
"ParentID": null,
"subtasks": []
}
]
Für zwei Ebenen (Root und Kinder) versuche ich, Todos, die keine übergeordnete ID (Root) haben, in ein Array zu verschieben und dann Todos, die über ein übergeordnetes Element verfügen, in das übergeordnete Todo zu verschieben
Ich habe eine Hierarchie mit zwei Ebenen ausprobiert und denke, dass sie gut funktioniert, weiß aber nicht, wie ich mehr Ebenen in meinem next.js-Projekt implementieren kann, und ich bin mir nicht ganz sicher, ob dies eine gute Vorgehensweise ist oder nicht.
hier der Code, den ich habe versucht.
Code: Select all
const data = [
{id: 2, Name:"Task 1.1", ParentID: 1},
{id: 5, Name:"Task 2", ParentID: null},
{id: 6, Name:"Task 2.1", ParentID: 5},
{id: 1, Name:"Task 1", ParentID: null},
{id: 3, Name:"Task 1.2", ParentID: 1},
{id: 4, Name:"Task 1.3", ParentID: 1},
{id: 7, Name:"Task 2.2", ParentID: 5},
{id: 8, Name:"Task 2.3", ParentID: 5},
{id: 9, Name:"Task 3", ParentID: null},
];
function buildHierarchy(data) {
let result = [];
let todos = [...data];
// construct root level
todos.forEach((task)=>{
if(task.ParentID === null){
const new_task = {...task, subtasks:[]}
result.push(new_task)
}
})
// constrct child level
result.forEach((parent, index)=>{
todos.forEach((task)=>{
if(task.ParentID === parent.id){
const new_task = {...task, subtasks:[]}
parent.subtasks.push(new_task)
}
})
})
return result
}
const result = buildHierarchy(data);
console.log(JSON.stringify(result,null,2));
Ich möchte eine einfache Abfrage in Hierarchie-JSON formatieren, um sie im Front-End anzuzeigen, aber ich weiß nicht, wie
Ich habe möglicherweise eine relationale Datenbank mit einer Tabelle namens „Todo“. folgende Spalte
[list]
[*]ID
[*]Name
[*]ParentID[/list]
zum Beispiel
[code][
{id: 2, Name:"Task 1.1", ParentID: 1},
{id: 5, Name:"Task 2", ParentID: null},
{id: 6, Name:"Task 2.1", ParentID: 5},
{id: 1, Name:"Task 1", ParentID: null},
{id: 3, Name:"Task 1.2", ParentID: 1},
{id: 4, Name:"Task 1.3", ParentID: 1},
{id: 7, Name:"Task 2.2", ParentID: 5},
{id: 8, Name:"Task 2.3", ParentID: 5},
{id: 9, Name:"Task 3", ParentID: null}
]
[/code]
bis
[code][
{
"id": 5,
"Name": "Task 2",
"ParentID": null,
"subtasks": [
{
"id": 6,
"Name": "Task 2.1",
"ParentID": 5,
"subtasks": []
},
{
"id": 7,
"Name": "Task 2.2",
"ParentID": 5,
"subtasks": []
},
{
"id": 8,
"Name": "Task 2.3",
"ParentID": 5,
"subtasks": []
}
]
},
{
"id": 1,
"Name": "Task 1",
"ParentID": null,
"subtasks": [
{
"id": 2,
"Name": "Task 1.1",
"ParentID": 1,
"subtasks": []
},
{
"id": 3,
"Name": "Task 1.2",
"ParentID": 1,
"subtasks": []
},
{
"id": 4,
"Name": "Task 1.3",
"ParentID": 1,
"subtasks": []
}
]
},
{
"id": 9,
"Name": "Task 3",
"ParentID": null,
"subtasks": []
}
]
[/code]
Für zwei Ebenen (Root und Kinder) versuche ich, Todos, die keine übergeordnete ID (Root) haben, in ein Array zu verschieben und dann Todos, die über ein übergeordnetes Element verfügen, in das übergeordnete Todo zu verschieben
Ich habe eine Hierarchie mit zwei Ebenen ausprobiert und denke, dass sie gut funktioniert, weiß aber nicht, wie ich mehr Ebenen in meinem next.js-Projekt implementieren kann, und ich bin mir nicht ganz sicher, ob dies eine gute Vorgehensweise ist oder nicht.
hier der Code, den ich habe versucht.
[code]const data = [
{id: 2, Name:"Task 1.1", ParentID: 1},
{id: 5, Name:"Task 2", ParentID: null},
{id: 6, Name:"Task 2.1", ParentID: 5},
{id: 1, Name:"Task 1", ParentID: null},
{id: 3, Name:"Task 1.2", ParentID: 1},
{id: 4, Name:"Task 1.3", ParentID: 1},
{id: 7, Name:"Task 2.2", ParentID: 5},
{id: 8, Name:"Task 2.3", ParentID: 5},
{id: 9, Name:"Task 3", ParentID: null},
];
function buildHierarchy(data) {
let result = [];
let todos = [...data];
// construct root level
todos.forEach((task)=>{
if(task.ParentID === null){
const new_task = {...task, subtasks:[]}
result.push(new_task)
}
})
// constrct child level
result.forEach((parent, index)=>{
todos.forEach((task)=>{
if(task.ParentID === parent.id){
const new_task = {...task, subtasks:[]}
parent.subtasks.push(new_task)
}
})
})
return result
}
const result = buildHierarchy(data);
console.log(JSON.stringify(result,null,2));
[/code]