Flex Grow在React Native中不使用FlatList

时间:2017-05-12 03:00:14

标签: react-native react-native-flatlist

我正在尝试使用FlatList进行flexGrow,但它不能正常工作,因为它适用于ListView。即使屏幕上有空格,也会使用minWidth值渲染项目。 示例代码:

class ProductListScreen extends Component {
    render () {
    return (<FlatList
    contentContainerStyle={styles.list}
    showsVerticalScrollIndicator={false}
    data={[{key: 'a'}, {key: 'b'},{key: 'c'},{key: 'd'}, {key: 'e'},{key: 'f'},{key: 'g'}, {key: 'h'},{key: 'i'},{key: 'j'}]}
    renderItem={this.renderItem}
    />);
    renderItem({ item, index }) {
    return <View style={{
    flexGrow: 1,
    margin: 5,
    minWidth: 154,
    maxWidth: 223,
    height: 304,
    maxHeight:304,
    backgroundColor: '#CCC',
    }}/>;
    }
}
    var styles = StyleSheet.create({
      list: {
        justifyContent: 'center',
        flexDirection: 'row',
        flexWrap: 'wrap'
      })

0 个答案:

没有答案