как изменить единый стиль в реактивных нативных стилях - PullRequest
0 голосов
/ 09 июля 2020

У меня есть стиль по умолчанию

const styles = StyleSheet.create({
  textStyle : {
    fontSize : 20,
    fontWeight : "bold",
    color : "red",
    margin : 20
  }
});

теперь я применил его к различным текстовым полям,

<ScrollView>
      <Text style={styles.textStyle}>Hello World React Native</Text>
      <View>
        <Text style={styles.textStyle}>1234567</Text>
      </View>
</ScrollView>

Я просто хочу, чтобы числа были зелеными со всеми другими стилями. Как этого добиться.

Я попробовал что-то вроде ниже, но это не сработало.

styles.textStyle.color("green")

Ответы [ 2 ]

2 голосов
/ 09 июля 2020

Вы можете переопределить стили, как показано ниже

 <Text style={[styles.textStyle,{color:'green'}]}>1234567</Text>
1 голос
/ 09 июля 2020

Как упоминалось в предыдущем ответе, вы можете переопределить с помощью самого кода.

<ScrollView>
      <Text style={styles.textStyle}>Hello World React Native</Text>
      <View>
        <Text style={[styles.textStyle, { color: "green" }]}>1234567</Text>
      </View>
</ScrollView>

или Если вам нужны стили в отдельном файле или константе, вы можете использовать его, например,

const styles = StyleSheet.create({
  textStyle : {
    fontSize : 20,
    fontWeight : "bold",
    color : "red",
    margin : 20
  },
  numberStyle : {
    color: "green"
  }
});

    <ScrollView>
          <Text style={styles.textStyle}>Hello World React Native</Text>
          <View>
            <Text style={[styles.textStyle, styles.numberStyle]}>1234567</Text>
          </View>
    </ScrollView>

Пожалуйста, вернитесь ко мне, если вам нужна дополнительная информация.

...