React Native 中的文本重叠和样式答案

【问题标题】：Text imbrication and style in React NativeReact Native 中的文本重叠和样式
【发布时间】：2019-10-16 14:02:10
【问题描述】：

我想在 React Native 中更改部分 Text 的样式。

我试过了：

<Text style={styles.parent}>
    Dernier message : <Text style={[styles.children, {
        color: 'red',
        paddingLeft: 10,
        borderWidth: 5,
        borderColor: 'black',
    }]}>Coucou</Text>
</Text>

const styles = StyleSheet.create({
    parent: {
        backgroundColor: 'yellow',
    },
    children: {
        backgroundColor: 'blue',
    },
})

父背景颜色已更改 - 好
儿童颜色和背景颜色已更改 - 好
儿童向左填充且边框未更改

你能帮帮我吗？谢谢

【问题讨论】：

标签： reactjs react-native

【解决方案1】：

就布局而言，<Text> 元素是特殊的。来自文档：“里面的所有东西都不再使用 flexbox 布局，而是使用文本布局。这意味着 <Text> 内的元素不再是矩形，而是在看到行尾时换行。”

为了实现您似乎正在寻找的东西，建议使用带有两个内部 <Text>s 的 wrapping<View>。

PFB 世博小吃链接。希望能帮助到你 Expo link

【讨论】：

现在您可以通过添加样式来根据您的要求进行自定义