React Native 如何包装内容视图答案

【问题标题】：React native how to wrap content viewReact Native 如何包装内容视图
【发布时间】：2016-11-09 09:06:59
【问题描述】：

我对 RN 很陌生，无论如何要包装视图的内容，类似于 Android。在 Android 中我可以调整，Height: 'wrap-content'，但在 RN 中，我不能做任何 wrap content。

要么我设置了视图的高度，要么只是 flex，但仍然没有包裹视图。

【问题讨论】：

【解决方案1】：

你可以像这样设置父组件包裹子组件。

alignSelf: '基线'

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

水平包裹子内容。

【讨论】：

【解决方案2】：

在flexDirection: "row"的情况下，你应该使用flexWrap: "wrap"来包装里面的项目。

【讨论】：

【解决方案3】：

如果内容是垂直的，它应该默认换行；如果内容是横向的，事情就会变得棘手...... 对我有用的是将视图容器放在另一个视图中：

<View style={{alignItems: "center"}}>
    <View style={{flexDirection: "row"}}>
        <Image/><Text/>
    </View>
</View>

【讨论】：

【解决方案4】：

如果 'flex' 属性未设置，则视图默认包装其内容。

如果您需要视图填充父级宽度或高度，请将“alignSelf”属性设置为“拉伸”。

【讨论】：