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

请参阅此帖子以了解重复的问题： Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function but got: object

另外，请查看本文以获取更多ES6模块的使用学习： http://2ality.com/2014/09/es6-modules-final.html

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

1 个答案: