如何使平面列表渲染文本,视图元素?在rn中,我目前使用滚动视图,但我想测试平面列表我读了rn文档了解它,但我不能渲染文本视图元素与他们的风格,谁能告诉如何以正确的方式做到这一点?我只是想使用平面列表而不是滚动视图
要呈现的元素:
<View style={styles.section1}>
<Image style={styles.profileimg} source={{ uri: data.profilepic }} />
<Text style={styles.usernameText}>@{data.username}</Text>
<View style={styles.Postrow}>
<View style={styles.Postrow1}>
<Text style={styles.followerTxt}>UpVotes</Text>
<Text style={styles.UpVote}>{data.upvotes}</Text>
</View>
<View style={styles.verticalLine}></View>
<View style={styles.Postrow1}>
<Text style={styles.followerTxt}>DownVotes</Text>
<Text style={styles.UpVote}>{data.downvotes}</Text>
</View>
<View style={styles.verticalLine}></View>
<View style={styles.Postrow1}>
<Text style={styles.followerTxt}>Posts</Text>
<Text style={styles.UpVote}>{data.post.length}</Text>
</View>
</View>
<Text style={styles.decs}>Hello this is des</Text>
</View>
<View style={styles.section1}>
<Text style={styles.postTxt}>Your Posts</Text>
<View style={styles.posts}>
{
data.post.map((item) => {
return (
<Image key={item.id} style={styles.Postimage} source={{ uri: item.postimg }} />
)
})
}
</View>
</View>
2条答案
按热度按时间ha5z0ras1#
您需要将
renderItem
属性与FlatList
一起使用首先创建函数组件并将其传递给
renderItem
属性:屏幕中的调用平面列表:
rur96b6h2#
你可以使用下面的代码:-