带有来自 api 的数组的 Remapp 对象，带有新的键和结构

Question

我的返回对象有一个输出，如下所示：

{
 data:
  [
   {
    ts: "20-10-26",
    events: 1500,
   }, 
   {
    ts: "20-10-27",
    events: 1280,
   },
   {
    ts: "20-10-28",
    events: 1111,
   }
  ]   
}

我需要让它看起来像这样

[
  {
    id: "events",
    color: "hsl(331, 70%, 50%)",
    data: [
      {
        x: "20-10-26",
        y: 1500
      },
      {
        x: "20-10-27",
        y: 1280
      },
      {
        x: "20-10-28",
        y: 1111
      }
    ]
  }
]

所以我需要的是将键从 ts 和 events 更改为 x 和 y。还要添加两个带有静态数据 ID 和颜色的字段。我使用来自https://nivo.rocks/line/ 的图表，他们需要这样格式化的数据。

Answer 1

将数据数组映射到具有指定键的新对象数组。

data.map(({ ts: x, events: y }) => ({ x, y }))

data.map(({ ts: x, events: y }) => ({ x, y }))

如果这是您的图形组件需要的，请将格式化的数据放入数组中。