更改所有子元素的字体大小和颜色

Posted 2023-03-07

【中文标题】更改所有子元素的字体大小和颜色

【英文标题】：Change font size and color of all child elements

【发布时间】：2019-10-22 14:07:20

【问题描述】：

使用 react native，我想。

我试过了，但它不起作用：

<View style=styles.last_post>
    <Text>
        Blablabla
    </Text>
    <Text>
        Blablabla
    </Text>
    <Text>
        Blablabla
    </Text>
</View>


const styles = StyleSheet.create(
    ...
    last_post: 
        flex: 1,
        flexDirection: 'row',
        flexWrap: 'wrap',
        color: '#495057',
        fontSize: 12,
    ,
    ...
)

【问题讨论】：

直接传递给文本<Text style=styles.titleText></Text>

【参考方案1】：

不要将样式放在视图中，而是尝试放入每个文本元素：

<View style=styles.text_post>
    <Text style=styles.last_post>
        Blablabla
    </Text>
    <Text style=styles.last_post>
        Blablabla
    </Text>
    <Text style=styles.last_post>
        Blablabla
    </Text>
</View>


const styles = StyleSheet.create(
    ...
    last_post: 
        color: '#495057',
        fontSize: 12,
    ,
    text_post:
     flex: 1,
        flexDirection: 'row',
        flexWrap: 'wrap',



    ...
)

因此，您在这里创建了一个全局 css 样式并应用于每个文本元素。您只需在一处更改即可。