如何在 React Native 中构建以下网格

Question

我正在尝试使用 React Native 从我的手机重建联系人列表。网格如下所示：

目前我有一个样式为{ flexDirection: 'row', flexWrap: 'wrap' } 的网格包装器，每个子样式为{ width: '40%', flexGrow: 1 }。如果有偶数个孩子，它工作得很好，但是当有奇数时，最后一个孩子占据了整个宽度。我需要最后一个孩子向左浮动并与其他孩子具有相同的宽度。最好的方法是什么？

Answer 1

容器样式{ flexDirection: 'row', flexWrap: 'wrap' } contactItemStyle { height: 100, width: '50%' } 宽度 40% 没有意义，因为 100/2 = 50。

您可以将 contactItems 的高度设置为大于 0 的任何值。 忘记contactItems上的flexGrow属性。