Question

我有一个嵌套的导航结构。
需要登录到“个人资料”屏幕的登录屏幕，“个人资料”需要导航到“收件箱”。这样，请登录->个人资料->收件箱。

唱歌

import React, {Component} from 'react';
import Profile from "../Profile";

class AppSignIn extends React.Component{

_doSignIn(){
 this.props.navigation.navigate('Profile')
}

render(){
  return(
     <View>
      <TouchableHighlight onPress={this._doSignIn.bind(this)}>
          <Text>Go to Profile</Text>
      </TouchableHighlight>
     </View>
    )
 }
}

const AppSignInNav = createStackNavigator(
 {
    AppSignIn:{
    screen : AppSignIn
  },
  Profile:{
    screen:Profile
  }
 });

 export default createAppContainer(AppSignInNav);

个人资料

import React, {Component} from 'react';
import Inbox from "../Inbox";

class Profile extends React.Component{

_goToInbox(){
 this.props.navigation.navigate('Inbox')
}

render(){
  return(
     <View>
      <TouchableHighlight onPress={this._goToInbox.bind(this)}>
          <Text>Go to Inbox</Text>
      </TouchableHighlight>
     </View>
    )
 }
}

const ProfileNav = createStackNavigator(
 {
    Profile:{
    screen : Profile
  },
  Inbox:{
    screen : Inbox
  }
 });

 export default createAppContainer(ProfileNav);

由于尝试从 createStackNavigator 导航至另一个导航而导致的此错误。 The component for route 'Profile' must be a React component...

如何将个人资料导出为React组件，但仍然可以导航至收件箱。

Answer 1

只能有一个appContainer用于导航。您正在尝试使用createAppContainer两次创建应用容器。

您可以将AppSignInNav用作应用程序容器，并将ProfileNav导出为普通StackNavigator。

请参阅this链接，以详细了解createAppContainer及其用途。

从一个堆栈导航到另一个堆栈

1 个答案: