如何使 View 元素的所有 Text 子元素具有相同的样式？答案

【问题标题】：How can I make all the Text children of a View element have the same style?如何使 View 元素的所有 Text 子元素具有相同的样式？
【发布时间】：2017-03-29 00:16:20
【问题描述】：

我想要一些类似于 CSS 的东西，您可以在其中为 div 赋予“颜色”样式，并且其中的任何文本都会有它。

我在一个视图组件中有多个文本组件，我希望它们都具有相同的文本颜色。

如果我将“颜色”样式传递给视图，它会引发警告。

我希望避免将相同的样式传递给所有这些孩子，因为他们的父母可以拥有所有孩子的样式。

我想从这里开始：

<View>
  <Text style={styles.Warning}>
  </Text>
  <Text style={styles.Warning}>
  </Text>
  <Text style={styles.Warning}>
  </Text>
  <Text style={styles.Warning}>
  </Text>
  <Text style={styles.Warning}>
  </Text>
</View>

对此：

<View style={styles.Warning}>
  <Text>
  </Text>
  <Text>
  </Text>
  <Text>
  </Text>
  <Text>
  </Text>
  <Text>
  </Text>
</View>

样式为：

const styles = StyleSheet.create({
  Warning:{
    color:'#a94442'
  }
});

（如果我不需要安装任何东西会更好）谢谢。

【问题讨论】：

标签： css text view react-native styles

【解决方案1】：

是的，你绝对可以做你想做的。您唯一缺少的部分是在 View 容器中包含 Text 容器。

例子：

<View>
 <Text style={{color:'red'}}>
   <Text>
     text1 // will inherit red color
   </Text>
   <Text>
     text2 // will inherit red color
   </Text>
 </Text>
</View>

有关更多信息，您还可以查看链接 https://facebook.github.io/react-native/docs/text.html#containers

【讨论】：

但这不是 OP 想要的布局？您现在将 Text 元素嵌套在 Text 元素中。