反应本机水平列表视图，没有滚动.如何包装物品

Question

我在列表中显示项目。我不想使用水平滚动视图，但是如何包装项目，使它们不会从屏幕上掉出来？就像我们在android中有FlowLayout一样，图片显示第一行的第三项是屏幕的一半。

<List  horizontal={true} 
                            scrollEnabled={false}
                            style={{flexWrap: "wrap"}}
                            dataArray={articleData.Types}
                              renderRow={(Type) =>
                                <ListItem style={{borderBottomWidth: 0}} content>
                                    <Button rounded>
                                    <Text>{Type.Name}</Text>
                                    </Button>
                                </ListItem>
                            }>
                            </List>

Answer 1

可以使用

视图来实现此目的：

<View style={styles.wrapContainer}>
    {DATA.map(data => {
      return (
        <View style={styles.buttonContainer} >
          <Button title={data.name}/>
        </View>
      )})
    }
  </View>

工作示例