无需滚动即可反应原生水平列表视图。 如何包装物品？

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>

工作示例