0

我正在尝试反应导航。我想从一个login屏幕导航到另一个屏幕。当我在 StackNavigator 中Home声明LoginScreen时出现上述错误。以下是我的代码。

更新:

路由.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
  }
});

我将其导入MyHome.js

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


    render(){
        return(

        <MyDrawer />
        );
    }

}
export default MyHome;

也在App.js(主页)内

return (

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

    );

不知道我在做什么错。请帮忙。点击登录按钮后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;
4

2 回答 2

2

您的路线名称是您在Route.js中定义的Home

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
      },
    });
于 2018-01-31T08:46:37.840 回答
0

路线名称是 Home 而不是 HomeScreen。

只需将 onPress 定义如下,它应该可以工作。

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

还要检查您的 LoginForm 导入。您可能已经像这样导入它

import LoginForm from './LoginForm';

但您可能没有正确导出它。

正确的做法是:

export default class LoginForm
于 2018-01-31T08:41:33.453 回答