2

我目前有一个数据集，它是一个对象数组。我.map用来列出每个对象中的某个键。

        {
          data.map(graph =>
            <div key={graph.ID}>
              <h2>{graph.name}</h2>
            </div>
          )
        }

graph是数据中的单个对象。这将打印出列表中每个对象的名称键。我现在遇到的麻烦是列出每个对象中的每个键。列表中的某些对象具有比其他对象更多的键，因此我不能手动列出每个键。有谁知道这是怎么做到的吗？

4

1 回答 1

1

你可以做的是，.map()再次使用，但使用Object.keys(obj).map()：

var graphs = [
  {
    graph: {
      name: "Praveen Kumar",
      age: 27,
      space: "YouTube"
    }
  }, {
    graph: {
      name: "Cat Techie",
      age: 25,
      gender: "Female"
    }
  }
];
console.log(graphs.map(item => {
  return `The value of ${item.graph.name}'s values are:
` + Object.keys(item.graph).map(key => {
    return `- ${key}: ${item.graph[key]}`;
  }).join("\n");
}));

在控制台上，我是这样的：

The value of Praveen Kumar's values are:
- name: Praveen Kumar
- age: 27
- space: YouTube
The value of Cat Techie's values are:
- name: Cat Techie
- age: 25
- gender: Female

上面的两个对象有不同的属性：spaceand gender，你可以使用Object.keys()它们来获取它们和它们的值。你也可以使用Object.entries()。

这是基本思想。你也可以在 React 中实现这个。如果您需要 React 解决方案，我很乐意提供相同的解决方案。

于 2020-12-03T21:26:56.160 回答