我有下面的json结构
{
"title": "Name(s)",
"type": "Text",
"data": [
{
"source": "DB",
"title": "All",
"list": [
{
"name": "ABCD",
"count": 1
},
{
"name": "BCDE",
"count": 1
},
{
"name": "CDEF",
"count": 1
},
{
"name": "DEFG",
"count": 2
},
{
"name": "EFGH",
"count": 1
}
]
}
]
},
{
"title": "Category(s)",
"type": "Text",
"data": [
{
"source": "DB",
"title": "All",
"list": [
{
"name": "Vegetables",
"count": 1942
},
{
"name": "Saloon",
"count": 355
},
{
"name": "General Store",
"count": 331
},
{
"name": "Restaurants",
"count": 130
},
{
"name": "Fast Food",
"count": 108
}
]
}
]
}
我正在尝试将数据显示为Like
第1节标题:“名称”第1行:“
ABCD”第2
行“ BCDE”第3
行“ CDEF”
。
。
。
第2节标题:“类别” 1stRow:“蔬菜”
2ndRow“ Saloon”第
3Row“ General Store”
。
。
。
在这里,我应该使用SectionList / Flatlist /混合两者以获得上述结果。
在flatlist / sectionlist中,我在renderSectionHeader中获得节头的名称和类别,但是在renderItem中,如何循环对象的“列表”数组。请让我知道
您必须像以下那样更新数据,
例如:
[
{
"title": "Name(s)",
"type": "Text",
"data": [
{
"name": "ABCD",
"count": 1
},
{
"name": "BCDE",
"count": 1
},
...
]
},
{
"title": "Category(s)",
"type": "Text",
"data": [
{
"name": "Vegetables",
"count": 1942
},
{
"name": "Saloon",
"count": 355
},
...
]
}
...
]
并SectionList
用于显示它,
例如:
...
<SectionList
renderItem={({item, index, section}) => <Text key={index}>{item.name}</Text>}
renderSectionHeader={({section: {title}}) => (
<Text style={{fontWeight: 'bold'}}>{title}</Text>
)}
sections={this.state.data}
keyExtractor={(item, index) => item + index}
/>
...
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句