通过React中的嵌套对象进行映射

时间:2019-04-11 16:18:58

标签: reactjs loops object nested

我在其他任何地方都找不到,所以我们开始吧。我试图通过嵌套对象进行映射并显示值,但我所能获得的只是显示的键。

对象:

data = {
  objectOne: {
    name: "some name",
    otherValue: "something else"
  },
  someValue: "someValue",
  someOtherValue: "asdasd",
  objectTwo : {
    v1 : "v1",
    v2 : "v2",
    v3 : "v3",
  }
}

我要遍历它的函数:(我只想显示objectOne的内容)

Object.keys(data.objectOne).map(field => <div key={field}>{field}</div>

这将返回nameotherValue,但不会返回实际值。

我在这里想念什么?

1 个答案:

答案 0 :(得分:1)

Object.keys()返回对象中的数组,这说明了为什么只打印键的原因。尝试改用Object.values()(ES2017):

Object.values(data.objectOne).map(value => <div key={value}>{value}</div>

或者,您可以坚持使用Object.keys,然后使用方括号表示法从data.objectOne对象获取该键的值:

Object.keys(data.objectOne).map(field => <div key={field}>{data.objectOne[field]}</div>