javascript - 对文本元素 react native 样式

Question

我是这样定义 JSX 的

<View style={[color: 'red']}>
<Text>Text1</Text>
<Text>Text2</Text>
<Text>Text3</Text>
</View>

View 组件没有颜色属性，它不应用子元素的文本颜色设置。

我不想对单个元素应用相同的样式。如何在父元素上定义样式并像 HTML 中的普通元素一样应用于所有子元素？

Answer 1

据我所知，没有简单的方法可以从 super 组件继承样式。

也许你可以像这样自定义一个组件:

 class YourComponent extends Component {
  render() {
    let children = [];
    React.Children.forEach(this.props.children, (item, index) => {
      // textStyle is the style that you want children to inherit
      children.push(React.cloneElement(item, this.props.textStyle));
    });

    return (
      <View>
        { children }
      </View>
    );
  }
}