Question

使用反应，我正在寻找一种转换此Json的方法

[
   {
      "date":"2019-01-01",
      "a":4000,
      "f":251,
      "h":0.15,
   },
   {
      "date":"2019-01-02",
      "a":878,
      "f":987,
      "h":0.87,
   },
   {
      "date":"2019-01-03",
      "a":1287,
      "f":412,
      "h":0.56,
   }
]

变成这样：

{
    date: [
        '2019-01-01',
        '2019-01-02',
        '2019-01-03'
    ],
    a: [
        4000,
        878,
        1287
    ]
};

但是使用Array.forEach，它不起作用，因为我无法创建命名键。

到目前为止，这就是我所拥有的（tempData是我收到的Json）：

let newData = [];
tempData.forEach((element,i) => {
    newData['date'][i] = element.date;
    newData['a'][i] = element.i;
});

我不知道如何创建一个想要的新数组

Answer 1

这是因为您已将newData指定为数组，但是您希望将其像对象一样使用。此外，对象中没有定义数组的键，因此在尝试插入键之前，首先需要对其进行定义。

如果您将声明更改为

let newData = { data: [], a: [] }

还需要修复此行

newData['a'][i] = element.i;

应该是

newData['a'][i] = element.a;

它应该工作。

let tempData = [
  {
    "date":"2019-01-01",
    "a":4000,
    "f":251,
    "h":0.15,
  },
  {
    "date":"2019-01-02",
    "a":878,
    "f":987,
    "h":0.87,
  },
  {
    "date":"2019-01-03",
    "a":1287,
    "f":412,
    "h":0.56,
  }
];

let newData = { date: [], a: []};
tempData.forEach((element,i) => {
    newData['date'][i] = element.date;
    newData['a'][i] = element.a;
});

console.log(newData)

如果需要，还可以在对象中动态创建键，与此类似。

let tempData = [
  {
    "date":"2019-01-01",
    "a":4000,
    "f":251,
    "h":0.15,
  },
  {
    "date":"2019-01-02",
    "a":878,
    "f":987,
    "h":0.87,
  },
  {
    "date":"2019-01-03",
    "a":1287,
    "f":412,
    "h":0.56,
  }
];

let newData = { };
let keys = Object.keys(tempData[0])
keys.forEach(key => {
  newData[key] = []
})

tempData.forEach((element,i) => {
    Object.keys(element).forEach( key => {
      newData[key].push(element[key])
    })
});

console.log(newData)

Answer 2

您实际上不需要React。您应该能够使用普通的JavaScript做到这一点。 Array对象上的map方法会有所帮助。这是一种实现方法：

let newData = {};
let dates = newData.map(data => data.date); // "dates" is now an array
let aValues = newData.map(data => data.a); // "aValues" is now an array
newData.date = dates;
newDate.a = aValues;

希望这会有所帮助！

在react中重新格式化数组

2 个答案: