Родитель-потомок TreeView в Javascript из файла JSON

Question

Я хочу создать массив объектов.И каждый объект может снова иметь массив объектов из файла JSON.Каждый объект в JSOn имеет parent_id, который сообщает, к какому идентификатору он принадлежит.

"data":[
        {
            "id":"node_0",
            "intentName":"pdf"
            "parent_id":"-1"
        },
        {
            "id":"node_2",
            "intentName":"Key Leadership",
            "parent_id":"node_0"
        },
        {
            "id":"node_3",
            "intentName":"Financial Results",
            "parent_id":"node_0"
        },
        {
            "id":"node_1",
            "intentName":"Business Summary",
            "parent_id":"node_0"
        },
        {
            "id":"node_7",
            "intentName":"Key Strategy",
            "parent_id":"node_1"
        },
        {
            "id":"node_34",
            "intentName":"CompanyInReport",
            "parent_id":"node_1"
        },
        {
            "id":"node_36",
            "intentName":"Operating Locations",
            "parent_id":"node_0"
        }]

Это файл JSON, у которого есть parent_id (-1 представляет корневой родительский элемент, а другой представляет его родительский идентификатор).Я хочу создать массив, как показано ниже, динамически при запуске.

menuItems = [
  {
    title: 'Key Leadership'
  },
  {
    title: 'Financial Results'
  },
  {
    title: 'Business Summary',
    values: [
      { title: 'Key Strategy'},
      { title: 'CompanyInReport'}
    ]
  },
  {
    title: 'Operating Locations'
  }]

Заранее спасибо.

Answer 1

Вы можете создать дерево, используя не только информацию об узле id, но и parent_id, а также присвоить информацию об узле узлу и родительскую информацию родительскому узлу.

Это приводитк древовидной структуре, принимая узлы в произвольном порядке.

В качестве результата берут только значения искомого родительского узла, в данном случае "node_0".

var data = [{ id: "node_0", intentName: "pdf", parent_id: "-1" }, { id: "node_2", intentName: "Key Leadership", parent_id: "node_0" }, { id: "node_3", intentName: "Financial Results", parent_id: "node_0" }, { id: "node_1", intentName: "Business Summary", parent_id: "node_0" }, { id: "node_7", intentName: "Key Strategy", parent_id: "node_1" }, { id: "node_34", intentName: "CompanyInReport", parent_id: "node_1" }, { id: "node_36", intentName: "Operating Locations", parent_id: "node_0" }],
    tree = function (data, root) {
        var o = {};

        data.forEach(({ id, intentName: title, parent_id }) => {
            Object.assign(o[id] = o[id] || {}, { title });
            o[parent_id] = o[parent_id] || {};
            o[parent_id].values = o[parent_id].values || [];
            o[parent_id].values.push(o[id]);
        });

        return o[root].values;
    }(data, 'node_0');

console.log(tree);

.as-console-wrapper { max-height: 100% !important; top: 0; }