Блог

У меня есть вложенный массив объектов со следующим форматом

 const arr1 = [
  {
    name: "internalcorp.com",
    children: [
      {
        name: "internalcorp.com.child1",
        children: [
          {
            name: "internalcorp.com.grandchild1",
            children: []
          },
          {
            name: "internalcorp.com.grandchild2",
            children: []
          }
        ]
      },
      {
        name: "internalcorp.com.child2",
        children: []
      }
    ]
  },
  {
    name: "internalcorpwebsite.com",
    children: [
      {
        name: "internalcorpwebsite.com.child1",
        children: []
      }
    ]
  }
];

 

Необходимо добавить className свойство к каждому объекту массива в зависимости от его уровня. Как, например, у родителя должны быть level-0 group , а у дочерних элементов должны быть level-x leaf , где x-номер уровня по отношению к основному родителю.

Вывод должен выглядеть так

 const result = [
  {
    name: "internalcorp.com",
    className: "level-0 group",
    children: [
      {
        name: "internalcorp.com.child1",
        className: "level-1 leaf",
        children: [
          {
            name: "internalcorp.com.grandchild1",
            className: "level-2 leaf",
            children: []
          },
          {
            name: "internalcorp.com.grandchild2",
            className: "level-2 leaf",
            children: []
          }
        ]
      },
      {
        name: "internalcorp.com.child2",
        className: "level-1 leaf",
        children: []
      }
    ]
  },
  {
    name: "internalcorpwebsite.com",
    className: "level-0 group",
    children: [
      {
        name: "internalcorpwebsite.com.child1",
        className: "level-1 leaf",
        children: [],
      }
    ],
  }
];

 

Код, который я пробовал

 const result = arr1.map((item,idx)=> {
  if(item.children.length){
    return {
      ...item,
      className: `level${idx} leaf`
    }
  }
})
 

Вы можете использовать силу рекурсии:

 function recursive(item, id) {
  let returnedItem = item

  if (item.children.length) {
    returnedItem = {
        ...returnedItem,
        children: returnedItem.children.map(childItem => recursive(childItem, id   1))
    }
  }

  if (0 === id) {
    return { ...returnedItem, className: `level-0 group` }
  }

  return { ...returnedItem, className: `level-${id} leaf` }
}

const result = arr1.map(item => recursive(item, 0))