我正在寻找一种方法,使水平ListView或FlatList在React原生。如下图所示:
我试着用Flex来管理它,但是它让我的结果很奇怪,而且总是用垂直的ListView如果你有什么想法,告诉我。此致,
1cosmwyk1#
答案是将horizontal属性集添加到true。是的,现在它在文档中描述:https://reactnative.dev/docs/flatlist#horizontal很明显,平面列表是滚动视图的子级,所以他得到了水平布尔值。
true
<FlatList horizontal={true} data={DATA} renderItem={renderItem} keyExtractor={(item) => item.id} extraData={selectedId} />
再见
zpgglvta2#
感谢您最后的回答,ListView现在已弃用。使用平面列表解决方案:
<FlatList style={styles.videos_flatList} horizontal={true} data={data1} renderItem={({item}) => <RowItem/> } ItemSeparatorComponent={() => { return ( <View style={{ height: "100%", width: 20, backgroundColor: "#CED0CE", }} /> ); }} keyExtractor={(item, index) => index.toString()} />
qvk1mo1f3#
FlatList的答案在上面,但它不是在RN中制作水平列表的唯一方法。如果要使React Native中的显示元素以最简单的方式显示在水平列表中,则只需将Flex Direction设置为Row:
myElement: { display: 'flex', flexDirection: 'row', },
3条答案
按热度按时间1cosmwyk1#
答案是将horizontal属性集添加到
true
。是的,现在它在文档中描述:https://reactnative.dev/docs/flatlist#horizontal
很明显,平面列表是滚动视图的子级,所以他得到了水平布尔值。
再见
zpgglvta2#
感谢您最后的回答,ListView现在已弃用。
使用平面列表解决方案:
qvk1mo1f3#
FlatList的答案在上面,但它不是在RN中制作水平列表的唯一方法。
如果要使React Native中的显示元素以最简单的方式显示在水平列表中,则只需将Flex Direction设置为Row: