React native 反应本机导航错误：路由登录应声明一个屏幕

我在尝试导航。我想从

login

屏幕导航到

Home

屏幕。当我在StackNavigator中声明

LoginScreen

时，我得到了上述错误。下面是我的代码

更新：

Route.js

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 RegisterForm from './RegisterForm';
import DetailedView from './DetailedView';
import IndividualSection from './IndividualSection';

const StackScreens = StackNavigator({
    LoginForm:{screen: LoginForm},
    RegisterForm: {screen: RegisterForm},
    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
  }
});

onPress={() => this.props.navigation.navigate("Home")}>

我在

MyHome.js中导入这个

import { MyDrawer} from 'LMS/src/components/Router';
class MyHome extends Component {


    render(){
        return(

        <MyDrawer />
        );
    }

}
export default MyHome;

不知道我做错了什么。请帮助。单击
LoginForm中的登录按钮后

class LoginForm extends Component {
render(){
return(

<TouchableOpacity style={styles.button} onPress={() => this.props.navigation.navigate("Home")}>
                                <Text style={{paddingLeft:50}}>Login</Text>
                                </TouchableOpacity>
);
}
export default LoginForm;

类LoginForm扩展组件{
render（）{
返回(
this.props.navigation.navigate（“Home”）}>
登录
);
}
导出默认登录信息；
路线名称是主屏幕而不是主屏幕

只需按如下方式定义onPress，它就可以工作了

onPress={() => this.props.navigation.navigate("Home")}>

还要检查您的LoginForm导入。
你可以像这样导入它

import LoginForm from './LoginForm';

但您可能没有正确导出它

正确的方法是：

export default class LoginForm

路线名称是主屏幕而不是主屏幕

只需按如下方式定义onPress，它就可以工作了

onPress={() => this.props.navigation.navigate("Home")}>

还要检查您的LoginForm导入。
你可以像这样导入它

import LoginForm from './LoginForm';

但您可能没有正确导出它

正确的方法是：

export default class LoginForm

您的路线名称是Home，正如您在route.js中定义的那样

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 RegisterForm from './RegisterForm';
import DetailedView from './DetailedView';
import IndividualSection from './IndividualSection';

const StackScreens = StackNavigator({
    LoginForm:{screen: LoginForm},
    RegisterForm: {screen: RegisterForm},
    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
  }
});

onPress={() => this.props.navigation.navigate("Home")}>

在您的Route.js定义LoginForm屏幕中，如下所示：

    export const MyDrawer = DrawerNavigator({

     LoginForm: {
      screen :LoginForm
      },
      Home: {
         screen: StackScreens,
      },
      Profile: {
          screen: Profile
      },
      FAQ: {
          screen: Faq
      },
    });

您的路线名称是Home，正如您在route.js中定义的那样

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 RegisterForm from './RegisterForm';
import DetailedView from './DetailedView';
import IndividualSection from './IndividualSection';

const StackScreens = StackNavigator({
    LoginForm:{screen: LoginForm},
    RegisterForm: {screen: RegisterForm},
    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
  }
});

onPress={() => this.props.navigation.navigate("Home")}>

在您的Route.js定义LoginForm屏幕中，如下所示：

    export const MyDrawer = DrawerNavigator({

     LoginForm: {
      screen :LoginForm
      },
      Home: {
         screen: StackScreens,
      },
      Profile: {
          screen: Profile
      },
      FAQ: {
          screen: Faq
      },
    });

我尝试了相同的方法，但仍然将此作为错误[1]：检查以上更新的答案，它将解决您的错误。您需要添加Route.js define LoginForm屏幕。因此，我不需要在
StackNavigator
中定义'LoginForm'，对吗？如果您的应用程序崩溃，您可以更新您的错误吗？我也尝试了同样的方法，但仍然将此作为错误[1]：检查上面更新的答案，它将解决您的错误。您需要添加Route.js define LoginForm屏幕。因此，我不需要在
StackNavigator
中定义'LoginForm'，对吗？您可以更新应用程序崩溃时的错误吗？请在routes.js中添加整个代码。此外，LoginFormalready导出默认类LoginForm的代码位于其类代码的末尾，请检查是否正确。您可以在routes.js中添加整个代码。此外，LoginFormalready导出默认类LoginForm的代码在其类代码的末尾，请正确检查