Question

我正在通过嵌套的导航器发送一些数据。标签导航器QR kod和eINFO上有2个屏幕。我要将数据传递到qr kod这里

      navigation.navigate("Drawer", {
        screen: "Home",
        params: {
          screen: "QR kod",
          params: { user: newUser },
        },
      });

这些是我的导航员

  return (
    <Tab.Navigator
      screenOptions={({route}) => ({
        tabBarIcon: ({focused, color, size}) => {
          let iconName;

          if (route.name === 'QR kod') {
            iconName = focused ? 'qrcode' : 'qrcode';
          } else if (route.name === 'eINFO') {
            iconName = focused ? 'infocirlceo' : 'infocirlceo';
          }

          return <AntDesign name={iconName} size={24} color={'black'} />;
        },
      })}
      tabBarOptions={{
        activeTintColor: 'red',
        inactiveTintColor: 'grey',
      }}>
      <Tab.Screen name="QR kod" component={Main} />
      <Tab.Screen name="eINFO" component={Einfo} />
    </Tab.Navigator>
  );
}

function DrawerNav() {
  return (
    <Drawer.Navigator initialRouteName="QR kod">
      <Drawer.Screen name="Home" component={TabNavigation} />
    </Drawer.Navigator>
  );
}

如何将数据同时传递到eINFO和QR kod

Answer 1

请注意，很遗憾，如果您使用navigation.navigate将数据传递到qr kod屏幕，则无法同时将相同的数据传递到eINFO屏幕。如果您想同时在两个屏幕上使用相同的数据，我的建议是使用一个像react-redux这样的全局状态管理器。使用react-redux，您不再需要使用navigation.navigate在屏幕之间传递数据。只需调度您需要重新存储的数据，然后读取所需屏幕中调度的数据即可。

Answer 2

在标签上使用initialParams道具可能会起作用。自动将参数传递给子屏幕很有用。

function Home(props) {
  const params = props.route.params;
  return (
    <Tab.Navigator
      screenOptions={({route}) => ({
        tabBarIcon: ({focused, color, size}) => {
          let iconName;
          ...
    }>
      <Tab.Screen name="QR kod" component={Main} initialParams={params} />
      <Tab.Screen name="eINFO" component={Einfo} initialParams={params} />
    </Tab.Navigator>
  );
}

然后，您的user参数将传递到两个屏幕。

将导航呼叫更改为：

navigation.navigate("Drawer", {
  screen: "Home",
  params: {
    screen: "QR kod",
    user: newUser,
  },
});

我不确定您发布的数据的数据流结构如何。通常，如乔凡尼·埃斯波西托（Giovanni Esposito）所说，Redux最好处理诸如“用户数据”之类的事情。

同时将参数传递到多个屏幕

2 个答案: