反应本机|导航器回到初始页面

时间:2019-01-21 07:17:18

标签: reactjs react-native react-router react-navigation

enter image description here

我在“路线”页面上有此导航器设置,我希望当我按this.props.navigation.goback函数时,如果我在第三页上,则应该将我带到第二页,但显然它将把我带到第二页。第一页。

即使具有Android或IOS的自然返回行为,它也会带我进入首页。

我通过

导航
this.props.navigation.navigate('Screens')

NavigatorPage:在这里,我正在使用DrawerNavigator

import {   createAppContainer ,createDrawerNavigator} from 'react-navigation';
import Dashboard from './pages/dashboard';
import Splash from './pages/Splash';
import Readmore from './pages/readmore';
import Tabs from './pages/tab';
import Check from './pages/checking';
import Search from './pages/searchpage';
import SideMenu from './componenet/sideMenu'
const AppNavigator = createDrawerNavigator({
 // Prac: { screen:  Check},
 Splash :{ screen:  Splash},
  Dashboard: { screen:  Dashboard},
    Readmore: { screen: Readmore },
    Tabs: { screen: Tabs },
    Search: { screen: Search }
  },
  {
    contentComponent: SideMenu,
    drawerWidth: 300,
    headerMode: 'none',
    navigationOptions: {
      headerVisible: false,
    }
   });
  export default createAppContainer(AppNavigator);

编辑一个

    const AppNavigator = createDrawerNavigator({
 // Prac: { screen:  Check},
 stacknav:{screen:stacknav}

  },
  {
    contentComponent: SideMenu,
    drawerWidth: 300,
    headerMode: 'none',
    navigationOptions: {
      headerVisible: false,
    }
   });

   const stacknav = createStackNavigator ({   Splash :{ screen:  Splash},
    Dashboard: { screen:  Dashboard},
      Readmore: { screen: Readmore },
      Tabs: { screen: Tabs },
      Search: { screen: Search } });



  export default createAppContainer(AppNavigator);

得到一个错误 Error

3 个答案:

答案 0 :(得分:1)

答案很简单  将您的抽屉导航器的所有屏幕放入新的createstacknavigator中。 然后,将子菜单中的stacknavigator继承在drawernavigator中。 即

 const stacknav = createStackNavigator ({   Splash :{ screen:  Splash},
    Dashboard: { screen:  Dashboard},
      Readmore: { screen: Readmore },
      Tabs: { screen: Tabs },
      Search: { screen: Search } });

Const appNavigator = createdrawernavigator({ stacknav:{screen:stacknav}},{ ...}}

希望有帮助。对不起,我在从移动设备回复时,代码结构不良。但是可以肯定的是,它将对您有所帮助。谢谢!

答案 1 :(得分:0)

使用createStackNavigator而不是createDrawerNavigator。

答案 2 :(得分:0)

我已经找到了解决方案,在此之前,我们需要注意一些事项。 确保每个const名称都以大写字母开头 我不能只是将堆栈导航器从同一文件导入到抽屉式导航器。 因此,我将堆栈放入另一个文件中,并将默认值直接导出到我的Drawernavigator中。 这解决了我的问题