在父映射内反应本机对象子映射

Question

是否可以从父映射映射子对象？

我有这样的数据：

[
 {
  "hdr_name": "A",
  "detail": [
    {
      "dtl_name": "Aaron Bennet"
    },
    {
      "dtl_name": "Ali Connors"
    }
  ]
 },
 {
  "hdr_name": "B",
  "detail": [
    {
      "dtl_name": "Bradley Horowitz"
    },
    {
      "dtl_name": "Brian Sweetland"
    },
  ]
 }
]

我想显示标题名称和详细信息名称，我使用地图获得了标题名称

{this.props.selcheckSheet.data.map((item, index) => {
  return (
     <ListItem itemDivider key={index} >
      <Body>
       <Text>{item.hdr_name}</Text>
      </Body>                          
     </ListItem>

     //How to loop detail in item.detail?

})}

那么，如何获取 item.detail 并渲染到 ListItem？ 我想渲染这样的视图：

Answer 1

是的，当然，与您已经完成父级的方式非常相似：

{this.props.selcheckSheet.data.map((item, index) => {
  return (
     <ListItem itemDivider key={index} >
      <Body>
       <Text>{item.hdr_name}</Text>
      </Body>                          
     </ListItem>

     {item.detail.map((u,i) => 
        <ListItem itemDivider key={'' + index + i} >
          <Body>
            <Text>{u.dtl_name}</Text>
          </Body>                          
        </ListItem>
     )}

}))}