Построение древовидного объекта - PullRequest
1 голос
/ 26 апреля 2020

Я хотел бы создать объект массива для дерева в React Native.

Realm DB возвращает следующие строки, поскольку они имеют родительско-дочернее отношение :

{
   "0":{
      "ID":3,
      "name":"KITCHEN",
      "parentID":2,
      "createdBY":null,
      "createdAT":null
   },
   "1":{
      "ID":4,
      "name":"BATHROOM",
      "parentID":2,
      "createdBY":null,
      "createdAT":null
   },
   "2":{
      "ID":5,
      "name":"OIL",
      "parentID":3,
      "createdBY":null,
      "createdAT":null
   },
   "3":{
      "ID":6,
      "name":"LIQUID",
      "parentID":5,
      "createdBY":null,
      "createdAT":null
   },
   "4":{
      "ID":7,
      "name":"SOLID",
      "parentID":5,
      "createdBY":null,
      "createdAT":null
   }
}

Объект должен выглядеть следующим образом:

 const treeData = [
      {
        key: 3,
        label: 'KITCHEN',
        nodes: [
          {
            key: '5',
            label: 'OIL',
            nodes: [
              {
                key: '6',
                label: 'LIQUID',
              },
              {
                key: '7',
                label: 'SOLID',
              },
            ],
          },
        ],
      },
      {
        key: 4,
        label: 'BATHROOM',
      },
    ];

Моя попытка проходила по всем строкам и получала их IDs, затем во вложенном l oop проверяя parentID с ID и, если будет какое-либо совпадение, добавить этот узел к другому объекту

Это дает мне только потомство любого из родителей.

for (var i = 0; i < rows.length; i++) {
      let tempID = rows[i].ID
      treeData = treeData.concat(rows[i])
      for (var j = 0; j < rows.length; j++) {
        let tempParentID = rows[j].parentID
        if (tempID == tempParentID) {
          subCategoryJson = subCategoryJson.concat(rows[j])
        }
      }
    }

Проблема в том, что я действительно не уверен, как сконструировать точно указанный выше объект Array.

PS. Я пытаюсь использовать следующий модуль узла: https://www.npmjs.com/package/react-simple-tree-menu

Ответы [ 2 ]

1 голос
/ 26 апреля 2020

Вы можете сохранить ключи и отфильтровать родительские узлы для результата.

var data = { 0: { ID: 3, name: "KITCHEN", parentID: 2, createdBY: null, createdAT: null }, 1: { ID: 4, name: "BATHROOM", parentID: 2, createdBY: null, createdAT: null }, 2: { ID: 5, name: "OIL", parentID: 3, createdBY: null, createdAT: null }, 3: { ID: 6, name: "LIQUID", parentID: 5, createdBY: null, createdAT: null }, 4: { ID: 7, name: "SOLID", parentID: 5, createdBY: null, createdAT: null } },
    tree = function (data) {
        var t = {},
            parents = {};

        Object.values(data).forEach(({ ID: key, name: label, parentID }) => {
            Object.assign(t[key] = t[key] || {}, { key, label });
            t[parentID] = t[parentID] || { };
            t[parentID].nodes = t[parentID].nodes || [];
            t[parentID].nodes.push(t[key]);
            parents[key] = true;
        });
        return Object
            .keys(t)
            .filter(k => !parents[k])
            .flatMap(k => t[k].nodes);
    }(data);

console.log(tree);
.as-console-wrapper { max-height: 100% !important; top: 0; }
1 голос
/ 26 апреля 2020

Сначала я должен l oop и создать объект поиска, чтобы было легко ссылаться на родителей и проверить, существует ли родитель.

После этого я бы снова l oop просмотрел данные и проверил чтобы увидеть, есть ли у него родитель, добавьте свойство узлов и добавьте в него элемент pu sh. Если не добавить в родительский узел.

const data = {
  "0": {
    "ID": 3,
    "name": "KITCHEN",
    "parentID": 2,
    "createdBY": null,
    "createdAT": null
  },
  "1": {
    "ID": 4,
    "name": "BATHROOM",
    "parentID": 2,
    "createdBY": null,
    "createdAT": null
  },
  "2": {
    "ID": 5,
    "name": "OIL",
    "parentID": 3,
    "createdBY": null,
    "createdAT": null
  },
  "3": {
    "ID": 6,
    "name": "LIQUID",
    "parentID": 5,
    "createdBY": null,
    "createdAT": null
  },
  "4": {
    "ID": 7,
    "name": "SOLID",
    "parentID": 5,
    "createdBY": null,
    "createdAT": null
  }
}
const values = Object.values(data)
const lookup = values.reduce((obj, entry) => ({
  [entry.ID]: entry,
  ...obj
}), {})

const result = values.reduce((arr, entry) => {
  const parent = lookup[entry.parentID]
  if (parent) {
    parent.nodes = parent.nodes || []
    parent.nodes.push(entry)
  } else {
    arr.push(entry)
  }
  return arr
}, [])
console.log(result)
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...