React native如何包装内容视图

Question

我是RN的新手,无论如何要包装视图的内容,类似于Android.在Android中我可以调整,Height:'wrap-content',但不知何故在RN中,我不能做任何包装内容.

它要么我设置了视图的高度,要么只是flex,但仍然没有包装视图.

Answer 1

您可以将父级组件设置为像这样包装子组件.

alignSelf:'基线'

<View style={{ alignSelf:'baseline'}}>
  <Text>Child Content</Text>
</View>

水平包裹子内容.

Answer 2

在的情况下flexDirection: "row"，你应该使用flexWrap: "wrap"到包裹里面的物品。

Answer 3

解决方案一：

您可以使用alignSelf: 'baseline'tp 设置父级来包装子组件，如下所示

<View style={{ alignSelf:'baseline'}}>
  <Text>Child</Text>
</View>

解决方案2：

在 的情况下flexDirection: "row"，您应该使用flexWrap: "wrap"视图wrap内的项目。

<View style={{ flexDirection: 'row', flexWrap: 'wrap'}}>
  <Text>Child</Text>
</View>