ChartJS ReactJS对象的对象

Question

我有一个这样的对象。

data = {
  "day1": {
    "found": 0,
    "lost": 3
  },
  "day2": {
    "found": 1,
    "lost": 2
  },
  "day3": {
    "found": 0,
    "lost": 3
  }
}

我想用ChartJS把它显示在一个线图上 day1,day2,day3是标签，foundlost是两条不同的线。我已经尝试过使用类似的东西，但我希望有一些更动态的方法，以防万一有第3个键会被添加到内部对象中，而不是将其全部推入一个数组。或者也许有一种方法可以不用先把所有的值先存储到一个数组中。

var found = [];
var lost = [];
Object.entries(data).map(([key]) => {
     [rates[key]].map(row => {
         found.push(row.found);
         lost.push(row.lost);
      })
    });


<Line
    data={{
      labels: Object.keys(data),
      datasets: [
        {
          data: found
          label: "found"
          borderColor: "blue",
          fill: true,
        },
        {
          data: lost
          label: "lost"
          borderColor: "red",
          fill: true,
        }
      ],
    }}
  />

Answer 1

首先提取标签。

const labels = Object.keys(data);

然后是值。

const found = labels.map(label => data[label].found);
const lost= labels.map(label => data[label].lost);