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

Question

我正在尝试包装我的物品，因此每行有多个物品。但它只是拒绝这样做。

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

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

嗨，这将使项目向右离开屏幕，然后会发生滚动。它应该尽可能多地容纳该行上的项目，直到它到达屏幕的右侧，然后下降到下一行等。

请帮忙。

谢谢

标签： reactjsflexboxnative

Answer 1

我很抱歉错过信息。我错了，你想要的可以通过这个 prop 中的样式来实现contentContainerStyle。FlatList 使用 ScrollView 道具，该道具具有设置 FlatList 内容样式的道具， 有关该道具的更多信息，
请参阅this。

通过添加它flexDirection: 'row'使contentContainerStyle内容水平并添加flexWrap: 'wrap'通过在没有空间时更改线条来完成所需的设计

看这个例子