reactjs - 如何在 React Native Flexbox 中水平包装项目？

Question

我正在尝试将我的项目换行，以便每行有多个项目。但它只是拒绝这样做。

如果有足够的空间，下一个项目应该位于同一行。

例如，我是灰色的吗？，删除我 - 应该在同一行，因为有足够的空间等。

嗨，这将使项目向右离开屏幕，然后发生滚动。它应该在该行中容纳尽可能多的项目，直到到达屏幕的右侧，然后下降到下一行，依此类推。

请帮忙。

谢谢

Answer 1

非常抱歉漏掉了信息。我错了，你想要的可以通过执行此 Prop contentContainerStyle 中的样式来实现。 FlatList 使用 ScrollView 属性，该属性具有用于设置 FlatList 内容样式的属性
请参阅this有关该 Prop 的更多信息。

通过将 flexDirection: 'row' 添加到 contentContainerStyle 可以使内容水平，并添加 flexWrap: 'wrap' 通过在以下情况下更改行来完成所需的设计:它没有空间

查看此example