Question

我在高图中创建了一个朝阳图，但在数组中创建图层时遇到了麻烦。

例如，标头数组是第2层，数据数组是第3层。

我需要将标题名称与数据中的组进行比较，并创建一个同时提供子ID和父ID的新数组。

已在代码下方发布了我当前的解决方案。

const headers = ['Cars', 'Fruits', 'Food'];

const data = [{
    group: 'Cars',
    name: 'BMW',
    value: '25641'
  }, {
    group: 'Fruits',
    name: 'Apple',
    value: '45876'
  },
  {
    group: 'Cars',
    name: 'Benz',
    value: '65784'
  },
  {
    group: 'Cars',
    name: 'Toyota',
    value: '254'
  },
  {
    group: 'Food',
    name: 'Pizza',
    value: '87535'
  },
  {
    group: 'Cars',
    name: 'Honda',
    value: '65796'
  },
  {
    group: 'Fruits',
    name: 'Banana',
    value: '98631'
  },
  {
    group: 'Fruits',
    name: 'Orange',
    value: '87563'
  },
  {
    group: 'Food',
    name: 'Burger',
    value: '78324'
  },
  {
    group: 'Fruits',
    name: 'Mango',
    value: '24598'
  }
]

这就是我尝试过的。

const newArray = headers.map(function(itemA, indexA) {
  return data.map(function(itemB, indexB) {
  return {
    id: `3.${indexB + 1}`,
    parentId: `2.${indexA + 1}`,
    value: itemB.value,
    name: itemB.name
  }
  })
})

这是我期望的输出：

const newArray = [{
    id: '3.1',
    parentId: '2.1',
    name: 'BMW',
    value: '25641'
  }, {
    id: '3.2',
    parentId: '2.2',
    name: 'Apple',
    value: '45876'
  },
  {
    id: '3.3',
    parentId: '2.1',
    name: 'Benz',
    value: '65784'
  },
  {
    id: '3.4',
    parentId: '2.1'
    name: 'Toyota',
    value: '254'
  },
  {
    id: '3.5',
    parentId: '2.3',
    name: 'Pizza',
    value: '87535'
  },
  {
    id: '3.6',
    parentId: '2.1',
    name: 'Honda',
    value: '65796'
  },
  {
    id: '3.7',
    parentId: '2.2',
    name: 'Banana',
    value: '98631'
  },
  {
    id: '3.8',
    parentId: '2.2',
    name: 'Orange',
    value: '87563'
  },
  {
    id: '3.9',
    parentId: '2.3',
    name: 'Burger',
    value: '78324'
  },
  {
    id: '3.10',
    parentId: '2.2',
    name: 'Mango',
    value: '24598'
  }
]

Answer 1

您不需要嵌套映射-它会导致嵌套结果数组。您只需要一个，因为data与您的预期输出之间存在一对一的关系。您可以map()遍历数据并随时查找父索引。

const headers = ['Cars', 'Fruits', 'Food'];

const data = [{group: 'Cars',name: 'BMW',value: '25641'}, {group: 'Fruits',name: 'Apple',value: '45876'},{group: 'Cars',name: 'Benz',value: '65784'},{group: 'Cars',name: 'Toyota',value: '254'},{group: 'Food',name: 'Pizza',value: '87535'},{group: 'Cars',name: 'Honda',value: '65796'},{group: 'Fruits',name: 'Banana',value: '98631'},{group: 'Fruits',name: 'Orange',value: '87563'},{group: 'Food',name: 'Burger',value: '78324'},{group: 'Fruits',name: 'Mango',value: '24598'}]

const newArray = data.map(function(itemB, indexB) {
    let parentIndex = headers.indexOf(itemB.group) // just find the parent index
    return {
      id: `3.${indexB + 1}`,
      parentId: `2.${parentIndex + 1}`,
      value: itemB.value,
      name: itemB.name
    }
    })

console.log(newArray)

比较两个数组并根据两个数组的索引添加新键

1 个答案: