如何继承样式表？答案

【问题标题】：How to inherit stylesheet?如何继承样式表？
【发布时间】：2017-05-20 23:03:56
【问题描述】：

为了在应用程序中提供自定义，我正在为样式制作一个单独的文件。

如下

'uses strict'

import {StyleSheet} from 'react-native'

const Styles = StyleSheet.create({
  welcome_page_style:{
    backgroundColor : 'red'
  },
  welcome_page_indicator_style:{
    backgroundColor : 'grey'
  },
  welcome_page_selected_indicator_style:{
    backgroundColor : 'black'
  },
  welcome_page_content_style : {
    flex : 1,
    justifyContent : 'center',
    alignItems : 'center',
    color : 'black',
    fontSize : 15
  }
}
);

现在从其他类，我继承了上面的样式并使用它如下。

import {StyleSheet, View, Text} from 'react-native';
import React, {Component, PropTypes} from 'react';
import {IndicatorViewPager, PagerDotIndicator} from 'rn-viewpager';
var Styles = require('./Theme')

export default class ViewPagerPage extends Component {
  static propTypes = {
      contentList : PropTypes.arrayOf(PropTypes.string).isRequired
  }

  constructor(props){
    super(props)
  }
    render() {
          return (
            <View style={{flex:1}}>
                <IndicatorViewPager
                    style={{flex:1}}
                    indicator={this._renderDotIndicator()}>
                    <View style={Styles.welcome_page_style}>
                       <Text style={Styles.welcome_page_content_style}>{this.props.contentList[0]}</Text>
                   </View>
                </IndicatorViewPager>
                </View>
              );
    }
    _renderDotIndicator() {
          return <PagerDotIndicator pageCount={this.props.contentList.length} dotStyle={Styles.welcome_page_indicator_style}/>;
      }
    }
module.exports = ViewPagerPage;

没有样式的影响。

如何应用其他类的样式？

【问题讨论】：

标签： android react-native styles stylesheet react-native-android

【解决方案1】：

您的 Theme.js 文件中没有导出调用。你的代码应该是：

export const Styles = StyleSheet.create(....

也在您的组件文件中。您可以使用以下作为 es6 代码：

import Style from "./Theme"

【讨论】：

如何使用设置样式？