带有水平道具的平面列表样式答案

【问题标题】：flatlist style with horizontal props带有水平道具的平面列表样式
【发布时间】：2019-02-20 03:23:21
【问题描述】：

当我将horizontal = {true}设置为FlatList时，flex:1在renderItem上不起作用，这个问题的解决方案是什么？

<FlatList
horizontal={true}
data={this.state.users}
renderItem={({item}) =>
<View style={{flex:1,backgroundColor:'blue'}}><Text>hello</Text></View>
                 }
keyExtractor={item => item.email}
/>

【问题讨论】：

您希望在 Flatlist 中呈现的项目的最终结果是什么？
@PritishVaidya 我要使用整个屏幕

标签： reactjs react-native

【解决方案1】：

为了覆盖整个屏幕，您可以添加以下样式

import {Dimensions} from 'react-native'
const {width, height} = Dimensions.get('window)

...
<View style={{flex:1, width, backgroundColor:'blue'}}><Text>hello</Text></View>

【讨论】：

谢谢，你能帮忙解决这个问题吗？ stackoverflow.com/questions/52290749
不确定那个快照的行为，但也许这会帮助react-native-snap-carousel

【解决方案2】：

找我好像你忘了在renderItem函数中添加return语句。

renderItem={({item}) => return(
<View style={{flex:1,backgroundColor:'blue'}}><Text>hello</Text></View>)

【讨论】：