如何将 JSON 数据转换为包含其他对象的对象？

Question

我想应用返回的数据在 Vuejs 中创建折线图

我的数据：

[{"A": 400},{"B": 1597},{"C": 1567}]

我的 vuejs 模板：

<template>
    <line-chart :data="Mydata"></line-chart>
</template>

<script>
export default {
    data () {
        return {
            My data: null
        }
    }  
}
</script>

折线图只能获取像My data: {"A": 400,"B": 1597,"C": 1567}这样的数据格式来绘制图形。

添加到 App VUE 后的预期输出

<template>
    <line-chart :data="Mydata"></line-chart>
</template>

<script>
export default {
    data () {
        return {
            My data: {"A": 400,"B": 1597,"C": 1567}
        }
    }  
}
</script>

Answer 1

你可以为此使用reducer函数：

const data = [{
  "A": 400
}, {
  "B": 1597
}, {
  "C": 1567
}].reduce((acc, curr) => {
  Object.keys(curr).forEach(key => acc[key] = curr[key]);
  return acc
}, {})

console.log(data)

如何将 JSON 数据转换为包含其他对象的对象？

How to convert JSON data to object that contains other objects?

arrays

object

chartkick

vue.js

chart.js