0

参考 Facebook 为 NavigatorIOS 提供的示例代码,我创建了一个简单的应用程序,它应该显示一个带有根视图的导航栏。NavigatorIOS 已包含在文件 App.js 中,根视图已在文件 SearchCompnent.js 中定义。

发生在我身上的问题是,当 SearchComponent 作为 initialRoute 组件链接到 NavigatorIOS 时,会引发错误:Element type is invalid: expected a string or a class/function.... 同时,如果我只是在 App 中包含 SearchComponent .js 它加载页面。我被这个问题困扰了一个多星期,没有得到任何解决方案。以下是代码:

应用程序.js

import React, { Component, PropTypes } from 'react';
import { NavigatorIOS, Text, View, StyleSheet } from 'react-native';
import SearchComponent from './src/components/SearchComponent';

export default class App extends React.Component {
  render() {
    return (
        <NavigatorIOS style={styles.container} initialRoute = {{title: 'Search Property', component: SearchComponent }} />
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#111111'
  },
});

SearchComponent.js

import React, { Component } from 'react';
import {
  View,
  Text,
  StyleSheet
} from 'react-native';

export default class SearchComponent extends Component {
  render() {
    return (
      <View style={styles.main}>
        <Text style={styles.title}>Search For Github User</Text>
      </View>
    )
  }
}

const styles = StyleSheet.create({
  main: {
    flex: 1,
    padding: 30,
    marginTop: 65,
    flexDirection: 'column',
    justifyContent: 'center',
    backgroundColor: '#2a8ab7'
  },
  title: {
    marginBottom: 20,
    fontSize: 25,
    textAlign: 'center'
  }
});

错误截图

4

0 回答 0