在抽屉堆栈之间传递参数反应导航

Jan*_*mal 9 parameter-passing navigation-drawer react-native react-navigation

我的路由器设置如下

import { createAppContainer, createDrawerNavigator, createStackNavigator, createSwitchNavigator } from "react-navigation";

import Home from "./components/Home";
import Search from "./components/Search";
import Map from "./components/Map";

import Login from "./components/Login";
import ForgotPassword from "./components/ForgotPassword";

import SideMenu from "./SideMenu";

const DashboardStack = createStackNavigator(
  {
    Home: { screen: Home },
    Search : {screen : Search}
  }
);

const MapStack = createStackNavigator(
  {
    Map: { screen: Map },
  }
);

const AuthStack = createStackNavigator(
  {
    Login: { screen: Login },
    ForgotPassword: { screen: ForgotPassword },
  }
);

export const DrawerStack = createDrawerNavigator(
  {
    Dashboard: { screen: DashboardStack },
    Map: { screen: MapStack },
  },
  {
    contentComponent: SideMenu,
    drawerWidth: 250
  }
);

export const AppNavigator = createStackNavigator(
  {
    Drawer: { screen: DrawerStack },
    Auth: { screen: AuthStack },
  },
  {
    // initialRouteName: "Drawer",
    headerMode: 'none',
    mode: 'modal',
  }
);

export default createAppContainer(DrawerStack);
Run Code Online (Sandbox Code Playgroud)

一切正常,只是一个小问题。当我从家里导航到搜索屏幕,然后使用参数切换到“地图”屏幕时,这些参数没有到达“地图”屏幕。

我当前的设置是在Codepan上

sfr*_*ini 4

您的问题是您的 MapStack 和地图屏幕都有相同的名称“地图”。

只需将 MapStack 路由替换为“MapStack”等其他内容,您就会获得参数。

请参阅此处:https: //snack.expo.io/SyTFUPZUB

export const DrawerStack = createDrawerNavigator(
  {
    Dashboard: { screen: DashboardStack },
    MapStack: { screen: MapStack },
  },
  {
    contentComponent: SideMenu,
    drawerWidth: 250
  }
);
Run Code Online (Sandbox Code Playgroud)