javascript - 如何在 React 中从 JSON 创建动态表头？

Question

我有一个 JSON 对象数组，我想在 React 中基于它创建一个动态表列/标题。

数据:

example = [
  {
    id: 0,
    city: 'New York',
  },
  {
    id: 1,
    city: 'Paris',
  },
]

我想遍历数组，获取 key 并添加额外的字段。到目前为止我已经:

columns() {
    return Object.keys(Example[0]).map((key) => {
      return {
        cityName: key,
        capital: false,
      };
    });
  }

我得到了键，但它们是无序的(随机)，并且额外的字段被添加到所有对象中。我想让每个键将其用作表头(列名称)，并能够更改每个对象的capital。我怎样才能在 React 中做到这一点？

Answer 1

您可以使用 Array.map 来实现此目的。

example = [
  {
    id: 0,
    city: 'New York',
  },
  {
    id: 1,
    city: 'Paris',
  },
];
example.map((obj) => {
  return {
   CITY : obj.city,
   ID : obj.id
   // Do whatever with the objects
 }
})