FlatList没有呈现我的json数组数据

Question

我在FlatList组件中呈现数组json数据时遇到问题。我通过网络和stackoverflow搜索了很多文档和信息。这是我看过的几个网页链接。但我想不通。

如何使用Flatlist

平面列表

平面列表未呈现

这是我的密码；

//Creating array for map the each item in places.
let array = [];
//Initializing the data to array for mapping it. data1 is my json data.
array.push(data1);
flatList = <FlatList
style={{ backgroundColor: 'red' }} // backgroundColor is visible but no List Component data in it.
data={array}
keyExtractor={(x, i) => i.toString()}
renderItem={({item}) => {
<List
district = {item.a.b.c.jsonArray[0].address}
phoneNumber = {item.a.b.c.jsonArray[0].phoneNumber}
neighbourhood = {item.a.b.c.jsonArray[0].sideInformation}
/> // nothing returns as <List />
}}
/>;

这是我的报税表；

return (
<View style={{ flex: 1 }} >
<TopBar
name={"title"}
bColor={"#1b92e7"}
miniLogo={require('../../../assets/pictures/image.png')}
/>
<List></List> 
<List></List>
{flatList}
</View>
);

在return语句中，它渲染这两个组件，但在flatList变量中，它不渲染。问题出在哪里？我希望你们能帮我？

我非常感谢你的努力。

Answer 1

您不会从renderItem返回任何内容试试看：

renderItem={({item}) => {
return (<List // for every item return your component
district = {item.a.b.c.jsonArray[0].address}
phoneNumber = {item.a.b.c.jsonArray[0].phoneNumber}
neighbourhood = {item.a.b.c.jsonArray[0].sideInformation}
/>); 
}}

或者只使用简短的语法：

renderItem={({item}) => (<List // take a look at the brackets
district = {item.a.b.c.jsonArray[0].address}
phoneNumber = {item.a.b.c.jsonArray[0].phoneNumber}
neighbourhood = {item.a.b.c.jsonArray[0].sideInformation}
/>
)}

Answer 2

作为@oma的回答，我将数据更改如下；

data = {array} -> data = {array[0]}

我的另一个错误是认为({item}(引用了我想要呈现的json数据。它必须等于我们想要呈现的json数据数组。

//final data.
data = {array[0].a.b.c.jsonArray}

作为@Stundji的回答，它应该返回列表。

renderItem={({item}) => {
return (<List
district = {item.address}
phoneNumber = {item.phoneNumber}
neighbourhood = {item.sideInformation}
/>); //now it returns list in FlatList
}}

感谢您的贡献。