使用 react js 合并并显示表中的对象数据数组

Posted 2023-03-23

【中文标题】使用 react js 合并并显示表中的对象数据数组

【英文标题】：merge and display array of object data in table using react js

【发布时间】：2021-11-01 19:26:05

【问题描述】：

我需要合并 array1 和 array2 ，显示在一个表格中

    array1= [ id: 1,event:party, oldcity: Singapore
              id: 2, event:fest,oldcity:Paris ]
    array2= [ id: 1,event:party, newcity: bombay
              id: 2, event:fest,newcity:madras ]
output of merge array
mergearray= [ id: 1,event:party,oldcity: Singapore,newcity: bombay
              id: 2, event:fest,oldcity:Paris,newcity:madras ]

display mergearray in table
  id    event oldcity   newcity
  1     party singapore  bombay
  2     fest  paris      madras

如果我合并数组

 mergearray[id: 1,event:party, oldcity: Singapore
            id: 2, event:fest,oldcity:Paris 
           id: 1,event:party, newcity: bombay 
          id: 2, event:fest,newcity:madras ]

但我希望是这样的

mergearray= [ id: 1,event:party,oldcity: Singapore,newcity: bombay
          id: 2, event:fest,oldcity:Paris,newcity:madras ]

【参考方案1】：

如何合并数组？

const array1 = [
  id: 1,
  event: 'party',
  oldcity: 'Singapore'
, 
  id: 2,
  event: 'fest',
  oldcity: 'Paris'
];
const array2 = [
  id: 1,
  event: 'party',
  newcity: 'bombay'
, 
  id: 2,
  event: 'fest',
  newcity: 'madras'
];

// I would merge arrays this way
const mergedArray = [...array1, ...array2];

console.log('mergedArray: ', mergedArray);

【讨论】：

No mergedArray 有 4 项。