@Misha5
профессиональный бомж

Как превратить плоский массив в дерево?

Мне нужно определить, в каких элементах и в каком кол-ве есть дочерние подэлементы - проще говоря, составить treeview из json файла.

Я попытался решить все через рекурсию, но сейчас нахожусь в ступоре. Функция просто возвращает undefined.

Вот рекурсия:

function f1(p) {
   for (i = 0; i < p.length; i++) {
      var z = data.filter(obj => obj.parentId === p[i].id);
      if(z){
        f1(z);
      } 
      else continue;
   }
}

Наметки кода:

$(document).ready(function() {
	var tree = document.getElementsByClassName("tree");

	$.getJSON('some_json_ssilka', function(data) {

		function f1(p) {
			for (i = 0; i < p.length; i++) {
				var z = data.filter(obj => obj.parentId === p[i].id);
				if(z){
					f1(z);
				} 
				else continue;
			}
		}

		var level = data.filter(obj => obj.parentId === -1);
		console.log(f1(level));
	});
});

Исходные данные:

[
    {
       "id":2,
       "title":"Folder 1",
       "parentId":-1
    },
    {
       "id":3,
       "title":"Test",
       "parentId":1
    },
    {
       "id":-1,
       "title":"Folder 2",
       "parentId":null
    },
    {
       "id":1,
       "title":"Folder 2",
       "parentId":-1
    },
    {
       "id":4,
       "title":"Wrike",
       "parentId":2
    },
    {
       "id":5,
       "title":"Tester",
       "parentId":1
    }
 ]
  • Вопрос задан
  • 825 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега JavaScript
попытался решить все через рекурсию

Рекурсией конечно можно:

const createTree = (data, idProp, parentProp, parentId) =>
  data.reduce((acc, n) => (parentId === n[parentProp] && acc.push({
    ...n,
    children: createTree(data, idProp, parentProp, n[idProp]),
  }), acc), []);


const tree = createTree(data, 'id', 'parentId', null);

Но вовсе не обязательно:

function createTree(data, idProp, parentProp) {
  const tree = Object.fromEntries(data.map(n => [ n[idProp], { ...n, children: [] } ]));

  return Object
    .values(tree)
    .filter(n => !(tree[n[parentProp]] && tree[n[parentProp]].children.push(n)));
}


const tree = createTree(data, 'id', 'parentId');
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы