javascript - React Native - 居中 flexWrap 内容

Question

我有一个 View这需要呈现列表中的项目。这些项目需要连续渲染，然后环绕。我可以通过使用 flexDirection 来实现这种行为和 flexWrap如下。问题是包裹的行都出现左对齐，因此在右边留下了一个不确定的空间。这是有道理的，但我想知道是否有办法将 flexWrap 的每一行中的内容居中。创造？

<View style={{alignItems: 'center', justifyContent: 'center'}}>
  <View style={{alignItems: 'center', justifyContent: 'center', flexDirection: 'row', flexWrap: 'wrap'}}>
    <Item value={1} />
    <Item value={2} />
    <Item value={3} />
  </View>
</View>

Answer 1

外部alignItems不知何故妨碍了。我不确定内部工作原理以及为什么会这样，但下面的代码现在可以按预期工作。

<View style={{justifyContent: 'center'}}>
  <View style={{alignItems: 'center', justifyContent: 'center', flexDirection: 'row', flexWrap: 'wrap'}}>
    <Item value={1} />
    <Item value={2} />
    <Item value={3} />
  </View>
</View>