将具有“路径”属性的平面数组转换为嵌套数组

Question

我有一个像这个例子一样的平面数组：

[
  {
    'name':'itemA',
    'path':'foo/bar'
  },
  {
    'name':'itemB',
    'path':'bar/foo'
  },
  {
    'name':'itemC',
    'path':'foo'
  },
  {
    'name':'itemD',
    'path':'bar'
  },
  {
    'name':'itemE',
    'path':'foo/bar/wizz'
  },
  {
    'name':'itemF',
    'path':'bar/foo'
  },
]

我想根据“路径”属性构建一棵树，所以我可以得到这个输出：

[
  {
    'name':'itemD',
    'path':'bar',
    'items':[
      {
        'name':'itemD',
        'path':'bar/foo'
      },
      {
        'name':'itemF',
        'path':'bar/foo'
      }
    ]
  },
  {
    'name':'itemC',
    'path':'foo',
    'items':[
      {
        'name':'itemA',
        'path':'foo/bar',
        'items':
        [
          {
            'name':'itemE',
            'path':'foo/bar/wizz'
          }
        ]
      },
    ]
  }
]

我怎样才能做到这一点？ 我发现了一些像 this one 这样的例子，但它们是基于父 ID 而不是像我这样的“路径”。

非常感谢！

Answer 1

您可以找到关卡或为分割路径的关卡添加新对象。

const
    data = [{ name: 'itemA', path: 'foo/bar' }, { name: 'itemB', path: 'bar/foo' }, { name: 'itemC', path: 'foo' }, { name: 'itemD', path: 'bar' }, { name: 'itemE', path: 'foo/bar/wizz' }, { name: 'itemF', path: 'bar/foo' }],
    tree = data.reduce((items, { name, path }) => {
        path.split('/').reduce((o, _, i, p) => {
            let path = p.slice(0, i + 1).join('/'),
                temp = (o.items ??= []).find(q => q.path === path);

            if (!temp) o.items.push(temp = { name, path });
            return temp;
        }, { items });
        return items;
    }, []);
   
console.log(tree);

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