Question

我有一个对象数组

const mainArray = [{
    name: 'main name',
    id: 'main id',
    parent: [{
      name: 'parent name',
      id: '1'
    }],
    child: [{
      name: 'child name',
      id: 'child id'
    }]
  }, {
    name: 'main name 2',
    id: 'main id 2',
    parent: [{
      name: 'parent name',
      id: '1'
    }],
    child: [{
      name: 'child name 2',
      id: 'child id 2'
    }]
  },
  {
    name: 'main name 3',
    id: 'main id 3',
    parent: [{
      name: 'parent name something else',
      id: '2'
    }],
    child: [{
      name: 'child name 3',
      id: 'child id 3'
    }]
  }
]

我需要将其提交给此表单

const resultArray = [{
  key: 'main',
  title: 'main name',
}, {
  key: 'parent',
  title: 'parent name'
}, {
  key: 'child',
  title: 'child name'
}]

到目前为止，我明白了

if (mainArray) {
   mainArray.map((main) => {
     if (main.child && main.child.length) {
       if (main.parent && main.parent.length) {
         main.parent.map((item) => {
           data.push({
             key: 'parent',
             title: item.name
           });
         });
       }

       data.push({
         key: 'main',
         title: main.name
       });

       main.child.map((item) => {
         data.push({
           key: 'child',
           title: item.name
         });
       });
     }
   });
 }

然后我用这个data array来显示一个表，它看起来像这样

我的问题是-两个mains可以不同，但是具有相同的parent（父母具有相同的ids），那么我不需要将父项添加到数组2中时间，我需要这样显示它

所以我正在寻找一种方法，以使两个parents对象具有相同的id来将它们合并在一起，以便在最终数组中只有一个parent并且main和该父级的child被困在一个parent上，而不是两个相同的

在link到jsfiddle

我可以使用 lodash

Answer 1

您可以先按父项分组并返回一个对象，其中每个键都是父名，然后从该对象中创建一个数组。

const mainArray = [{"name":"main name","id":"main id","parent":[{"name":"parent name","id":"1"}],"child":[{"name":"child name","id":"child id"}]},{"name":"main name 2","id":"main id 2","parent":[{"name":"parent name","id":"1"}],"child":[{"name":"child name 2","id":"child id 2"}]},{"name":"main name 3","id":"main id 3","parent":[{"name":"parent name something else","id":"2"}],"child":[{"name":"child name 3","id":"child id 3"}]}]


function children(rest, child) {
  const result = [{
    key: 'main',
    title: rest.name
  }];
  result.push(...child.map(({
    name
  }) => ({
    key: 'child',
    title: name
  })))
  return result;
}

const groupByParent = mainArray.reduce((r, {
  parent,
  child,
  ...rest
}) => {
  parent.forEach(p => {
    if (!r[p.name]) {
      r[p.name] = [{
          key: 'parent',
          title: p.name
        },
        ...children(rest, child)
      ]
    } else {
      r[p.name].push(...children(rest, child));
    }
  })

  return r;
}, {})

const result = Object.values(groupByParent).flat()
console.log(result)

映射到Javascript数组并将其中的对象转换为特定格式？

1 个答案: