react-native 出现奇怪的 StyleSheet 错误答案

【问题标题】：strange StyleSheet error with react-nativereact-native 出现奇怪的 StyleSheet 错误
【发布时间】：2018-10-23 13:09:23
【问题描述】：

我有一个包含 2 个类的 javascript 文件。对于这两个类，我都有单独的样式表。如下图：

export class PageOne extends Component {
   render(){
      return(
        <View style={pageOne.container}>
        ...
        </View>
   )
}

const pageOne = StyleSheet.create({
    container: {
      backgroundColor: '#FFDD33',
      flex: 1,
      width: '100%',
      flexDirection: 'row',
    },
    ...
});

export class PageTwo extends Component {
    render(){
      return(
        <View style={pageTwo.container}>
        ...
        </View>
      )
   }

const pageTwo = StyleSheet.create({
   container: {
     *Error ^*
   backgroundColor: '#FFFFFF',
   flex: 1,
   width: '100%',
 },
 ...
});

Error Image

【问题讨论】：

您可以将错误的输出粘贴为文本吗？图片裁剪掉了一些重要信息。

标签： javascript react-native stylesheet

【解决方案1】：

我认为您错过了关闭 PageOne 和 PageTwo 类组件的}。

试试这个：

export class PageOne extends Component {
   render() {
        return(
            <View style={pageOne.container}>
            ...
            </View>
        );
    }
}

const pageOne = StyleSheet.create({
    container: {
      backgroundColor: '#FFDD33',
      flex: 1,
      width: '100%',
      flexDirection: 'row',
    },
    ...
});

export class PageTwo extends Component {
    render(){
        return(
            <View style={pageTwo.container}>
                ...
            </View>
        )
    }
}

const pageTwo = StyleSheet.create({
   container: {
     *Error ^*
   backgroundColor: '#FFFFFF',
   flex: 1,
   width: '100%',
 },
 ...
});

【讨论】：