Javascript 如何使用react navigation在react native中从登录页面导航到主页？

我正在用react native做一个小应用。我对react不太了解，所以请帮忙。我正在尝试react导航。我希望已验证的用户重定向到主页。不知道我已尝试使用stack navigator，但不起作用。以下是代码

App.js

我还在MyHome.js中返回这个MyDrawer组件

MyHome.js

---

因此，现在在App.js中，它将返回包含登录和注册屏幕的MainNavigator。另外，如果我返回MyHome而不是MainNavigator wihin App.js，它将显示内部屏幕，而不在Route.js中提供LoginScreen作为堆栈。但是我想从登录页导航到主页，所以如何做到这一点？？？

是的，我找到了一个解决方案。我使用嵌套的navigator完成了此操作。在Route.js的App.js中定义了MainNavigator。现在我可以从登录屏幕导航到主屏幕

尝试先阅读文档，然后用错误屏幕截图发布代码，这将有助于解决stackoverflow问题。顺便说一句，您没有导入或导出LoginScreen，错误是什么告诉您，请完整发布您的route.js？我想知道你在进口什么。

class App extends Component {

    render(){
     const MainNavigator = TabNavigator({
         login: { screen : LoginScreen },
         register: { screen : RegisterForm },

     )};

    return (

    <View style={{flex: 1}}>
    <MainNavigator />
    </View>

    );
}

  class LoginForm extends Component {
    constructor(props) {
            super(props);

            this.initialState = {
                isLoading: false,
                error: null,
                username: '',
                password: '',           
            };
            this.state = this.initialState;
        }
   componentWillMount(){            
    fetch('https://www.mywebsite.com',{
        method: 'POST',
        headers:{
                    'Content-Type' : 'application/json',
                },
                body: JSON.stringify({
                    grant_type: 'authorization_code',
                    username: this.state.username,
                    password: this.state.password,
                    client_id: 'xxxxx',
                    client_secret: 'xxxx',
                    callback_url: 'www.mywebsite.com'
                })

    })  
      .then(response => response.json())
      .then((responseData) => {

            console.log(responseData);
          })    
       .done();
        }
        render(){
            return(


                                    <Button style={styles.button} onPress={() => this.props.navigation.navigate("HomeScreen")} >
                                        <Text style={{paddingLeft:50}}>Login</Text>
                                    </Button>
                      </View>
                     </View>                 
                   </Container>

            );
        }
    }
  export default LoginForm

import React, {Component} from 'react';
import { StackNavigator, DrawerNavigator } from 'react-navigation';
import Profile from './Profile';
import CourseListing from './CourseListing';
import Faq from './Faq';
import HomeScreen from './HomeScreen';
import CategoryDetail from './CategoryDetail';
import LoginForm from './LoginForm';
import DetailedView from './DetailedView';
import IndividualSection from './IndividualSection';
import LoginForm from './LoginForm';

const StackScreens = StackNavigator({
    LoginForm :{screen: LoginForm}
    CourseListing:{screen: CourseListing},
    Home: {screen: HomeScreen},
    CategoryDetail: {screen: CategoryDetail},
    DetailedView: {screen: DetailedView},
    IndividualSection: {screen: IndividualSection}
})

export const MyDrawer = DrawerNavigator({
   Home: {
     screen: StackScreens,
  },
  Profile: {
      screen: Profile
  },
  FAQ: {
      screen: Faq
  }
});

class MyHome extends Component {


    render(){
        return(

        <MyDrawer />
        );
    }

}
export default MyHome;