(0,y.StackNavigator)不是一个函数

时间:2019-01-10 15:16:05

标签: react-native react-native-ios react-native-navigation

我试图使用react-navigation StackNavigator,并多次回溯我的代码,但是找不到问题。我试图使用此功能为ios构建一个简单的导航菜单。

我正在使用博览会。因此,我通过使用“ create-react-native-app testExpo”命令通过终端创建一个新的expo项目来启动该项目。如下所示,我稍微修改了App.js,然后创建了一个screens文件夹->然后创建了两个屏幕:“ HomeScreen”和“ LoginScreen” 这些是我的代码和错误的图片

https://i.ibb.co/fQ9fjf2/Screen-Shot-2019-01-10-at-9-02-54-AM.png

https://i.ibb.co/7Xtx6jM/Screen-Shot-2019-01-10-at-9-03-01-AM.png

https://i.ibb.co/C8xbBVY/Screen-Shot-2019-01-10-at-9-03-07-AM.png

//错误图片 https://i.ibb.co/chgwYHT/Simulator-Screen-Shot-i-Phone-X-2019-01-10-at-08-59-08.png

App.js

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

    import LoginScreen from './screens/LoginScreen'
    import HomeScreen from './screens/HomeScreen'

    export default class App extends React.Component {
      render() {
        return (
          <AppNavigator />
        );
      }
    }


    const AppNavigator = StackNavigator({
      LoginScreen: {screen: LoginScreen},
      HomeScreen: {screen: HomeScreen}
    })

    const styles = StyleSheet.create({
      container: {
        flex: 1,
        backgroundColor: '#fff',
        alignItems: 'center',
        justifyContent: 'center',
      },
    });


HomeScreen.js

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

       class HomeScreen extends Component{
         render() {
           return(
             <View>
                <Text>This is the home screen</Text>
             </View>
           );
         }
       }

       export default HomeScreen;

LoginScreen.js

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

       class LoginScreen extends Component{
         render() {
           return(
             <View>
                <Text>This is the login screen</Text>
             </View>
           );
         }
       }

       export default LoginScreen;

我希望该应用程序可以在多个屏幕上启动。

0 个答案:

没有答案