如何在react native from API中显示嵌套数组数据

Question

我正在尝试从API获取并显示数据。下面是我从API得到的回复。我想显示细节数组中"名称"的值。请帮我解决这个问题。我试过低于代码的

{ 
"Success":1,
"data":[ 
{ 
"Date":"2019-11-08",
"Details":[ 
{ 
"Name":"Name 1",
"Id":72
},
{ 
"Name":"Name 2",
"Id":73
}
]
},
{ 
"Date":"2019-11-09",
"Details":[ 
{ 
"Name":"Name 3",
"Id":72
},
{ 
"Name":"Name 4",
"Id":73
}
]
}
]
}

Answer 1

Javascript映射函数可以用于嵌套迭代。

将您的数据存储为数据状态。如果在一个名为response的变量中收到响应，您可以将状态设置为

this.setState({ data : response.data })

然后您可以使用下面的代码片段来迭代嵌套的对象值

｛

this.state.data.map((dat, index) => { //Iterate through your data 
return (
<View style={styles.selectedCh} key={"outer-" + index}>
<Text>{dat.Date}</Text>
{
dat.Details.map((inner, indexInner) => {  //Iterate through inner Details
return (
<View style={{ flex: 1 }} key={"inner-" + indexInner} >
<Text>{inner.Id}</Text>
<Text>{inner.Name}</Text>
</View>
)
})
}
</View>
)
})
}