反应原生 |默认设置宽度样式答案

【问题标题】：React Native | Default Set Width Style反应原生 |默认设置宽度样式
【发布时间】：2021-03-01 19:28:37
【问题描述】：

我注意到，在使用 React native 添加“视图”时，即使我没有输入任何样式，它的行为也好像分配了“宽度：'100%'”。任何组件都存在相同的情况。它水平覆盖整个区域。是什么原因和解决方法？

    return (
        <View style={{flex:1}}>
            {/* paints the line he is in full red but should only paint as much as the line of the text */}
            <View style={{backgroundColor:'red'}}> 
                <Text>Example</Text>
            </View >
        </View>
    );

【问题讨论】：

请指定你想要的而不是width: 100%
我不想为每个元素输入宽度。我不认为你会回应。
没有。代码仅作为附件。

标签： react-native view styles

【解决方案1】：

如果你希望背景颜色只包含文本，你可以使用这个：

<Text style={{backgroundColor: 'red', alignSelf: 'flex-start'}}>
    Example
</Text>

【讨论】：

谢谢，这是一个解决方案。你知道这其中的原因吗？这是我第一次遇到除非我给出了迄今为止我知道的任何宽度或弯曲度，否则它不会完全水平。
在 react native 中，View 的宽度的默认值为 'auto' 因为你没有将它设置为其他任何值（'auto' 基本上是父级剩余空间的 100%，除非其他样式使其表现不同，即：flex)。