javascript - 如何将对象值数组映射到 ReactJS 中的键值数组？

Question

我正在尝试在我的 React 应用程序中使用从 axios 获取的 json 数据用于 echarts，但我不知道如何正确映射它。

我当前的代码从对象数组转换

[
    {
        "data": "24.64",
        "timestamp": "2019-04-30T02:00:42.032Z"
    },
    {
        "data": "24.13",
        "timestamp": "2019-04-30T02:20:36.966Z"
    }
]

2个州

data: ["24.64","24.13"]
timestamp: ["2019-04-30T02:00:42.032Z","2019-04-30T02:20:36.966Z"]

稍后我用

调用它们

this.state.data
and
this.state.timestamp

但这并没有给我想要的确切图表。

这是我当前工作代码的一部分，用于获取和转换对象数组:

componentDidMount() {
    this.getData(); 
};

getData() {      
    axios.get('/api/records/datatime')
    .then((res) => {  
      this.setState({ 
        data: res.data.map(({ data }) => data),
        timestamp: res.data.map(({ timestamp }) => timestamp),
      });
     })   
    .catch((err) => { console.log(err); });
}

我现在需要的是在我的状态下将对象数组更改为这样的数组数组，时间戳为键，数据为值。

chartData: 
  [
    ["2019-04-30T02:00:42.032Z","24.64"],
    ["2019-04-30T02:20:36.966Z","24.13"]
  ]

Answer 1

您可以使用Object.values()

this.setState({ 
  chartData:res.data.map(Object.values)
});

纯 js 中的工作片段

const arr= [ { "data": "24.64", "timestamp": "2019-04-30T02:00:42.032Z" }, { "data": "24.13", "timestamp": "2019-04-30T02:20:36.966Z" } ]
const res = arr.map(Object.values)
console.log(res)