react-native Styling Adding multiple styles


You can pass an array to the style prop to apply multiple styles. When there is a conflict, the last one in the list takes precedence.

import React, { Component } from 'react';
import { View, Text, StyleSheet } from 'react-native';

const styles = StyleSheet.create({
    red: {
        color: 'red'
    greenUnderline: {
        color: 'green',
        textDecoration: 'underline'
    big: {
        fontSize: 30

class Example extends Component {
    render() {
        return (
                <Text style={[, styles.big]}>Big red</Text>
                <Text style={[, styles.greenUnderline]}>Green underline</Text>
                <Text style={[styles.greenUnderline,]}>Red underline</Text>
                <Text style={[styles.greenUnderline,, styles.big]}>Big red underline</Text>
                <Text style={[styles.big, {color:'yellow'}]}>Big yellow</Text>