即使在导出后，createAppContainer也无法正常工作

Question

大家好，我是react native的新手，我正在尝试在react-native expo中设置基本路由，我无法弄清楚我错过了什么。这是我的app.js -

import React from "react";
import { createStackNavigator, createAppContainer  } from "react-navigation";
import LoginScreen  from "./src/components/screen/LoginScreen"
import HomeScreen  from "./src/components/screen/HomeScreen"


const RootStack = createStackNavigator({
LoginScreen: {
screen: LoginScreen
},
HomeScreen: {
screen: HomeScreen
}
});

const AppNavigator = createAppContainer(RootStack);

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

这是我的HomeScreen.js -

import React from "react";
import {
ScrollView,
Text,
View,
} from 'react-native';
export default class HomeScreen extends React.Component {


render() {
    return (
        <View >
            <ScrollView >
                <Text>Home Screen</Text>
            </ScrollView>
        </View>
    );
  }
} 

这是我的LoginScreen.js -

import React from "react";
import {
ScrollView,
Text,
View,
Button,
} from 'react-native';
import HomeScreen from "./HomeScreen"

export default class LoginScreen extends React.Component {


render() {
    return (
        <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }} >
                <Text>LoginScreen</Text>
                <Button onPress={ () => this.props.navigation.navigate('HomeScreen')} title = "Go To Home" />
        </View>
    );
 }
}

这将是非常有帮助的，如果有人可以建议它是什么，那就是我错过了，我能够看到登录屏幕上的一个按钮，但什么都没有发生在点击(无路由)。我测试了一下点击，它在android-toast上工作得很好。

Answer 1

您必须直接导出AppNavigator。

const App = createAppNavigator(RootStack);

export default App;

Answer 2

添加App.js

import React from 'react';
import { BrowserRouter,Route, Switch } from 'react-router-dom'
import LoginScreen  from "./src/components/screen/LoginScreen"
import HomeScreen  from "./src/components/screen/HomeScreen"

class RootStack  extends React.Component {
     <BrowserRouter>
                <Switch>
                    <Route exact path="/" component={LoginScreen} />
                    <Route exact path="/dashboard" component={HomeScreen} />
                </Switch>
            </BrowserRouter>
)


class App extends Component {
  render() {
    return (
      <RootStack  />
    );
  }
}

export default App;