如果路由不在索引文件中，则 React Navigation 无法正常工作

Question

当我遇到这个问题时，我正在练习我的反应导航技巧。如果这是一个新手问题，请原谅我。标题几乎概括了这一切。我在 Routes.js 文件中定义了一个 StackNavigator。当我运行它时，它不起作用。但是如果我把它放在索引文件中，它就可以正常工作。我确定我导出了 StackNavigator 并将其导入到我的 AppRegistry 所在的索引文件中。

我可能遗漏了一些东西，但我不确定是什么。

错误信息如下：

    Element type is invalid: expected a string (for built in 
    components) or a class/function (for composite components) but 
    got: undefined.

这是我的路线文件：

    import React, { Component } from 'react'
    import { StackNavigator } from 'react-navigation'

    import Hello from './screens/Hello'
    import Hi from './screens/Hi'
    import Ola from './screens/Ola'

    export const AppNavigator = StackNavigator({
        Hello: { screen: Hello },
        Hi: { screen: Hi },
        Ola: { screen: Ola }
    })

这是我的 index.ios.js 文件：

    import React, { Component } from 'react'
    import { AppRegistry } from 'react-native'
    import { StackNavigator } from 'react-navigation'

    import AppNavigator from './app/Routes'

    AppRegistry.registerComponent('nav', () => AppNavigator)

以上代码无效。但是这个确实如此：

    import React, { Component} from 'react'
    import { AppRegistry } from 'react-native'
    import { StackNavigator } from 'react-navigation'

    import Hello from './app/screens/Hello'
    import Hi from './app/screens/Hi'
    import Ola from './app/screens/Ola'

    export const AppNavigator = StackNavigator({
       Hello: { screen: Hello },
       Hi: { screen: Hi },
       Ola: { screen: Ola }
    })

    import AppNavigator from './app/Routes'

    AppRegistry.registerComponent('nav', () => AppNavigator)

我的线索是我没有正确导出 StackNavigator 或者我没有将它正确导入到索引文件中。任何帮助，将不胜感激。谢谢！

Answer 1

请参阅此 post 以了解重复的问题：

另外，更多ES6模块使用学习请查看这篇文章： http://2ality.com/2014/09/es6-modules-final.html

如果路由不在索引文件中，则 React Navigation 无法正常工作

React Navigation not working if routes is not in index files

navigation

stack

reactjs

react-native

react-navigation