在react-navigation v6中将数据从屏幕传回导航器

ff29svar  于 2022-11-30  发布在  React
关注(0)|答案(1)|浏览(159)

我有一个屏幕,可以由两个不同的导航器调用,如下所示:

const DataScreen = ( { navigation } ) => {
  // this is the data produced inside the component and that I want to pass back to the parent navigator.
  const data = { data: "someData" };
  navigation.goBack();
}

const Stack1 = createStackNavigator();

const Stack1Navigator = () => {
  // the data produced in dataScreen should be handled in the "way 1" here
  return <Stack1.Navigator>
    <Stack1.Screen name='dataScreen' component={DataScreen} />
  </Stack1.Navigator>
}

const Stack2 = createStackNavigator();

const Stack2Navigator = () => {
  // the data produced in dataScreen should be handled in the "way 2" here
  return <Stack2.Navigator>
    <Stack2.Screen name='dataScreen' component={DataScreen} />
  </Stack2.Navigator>
}

const RootStack = createStackNavigator();

const App = () => {
  return <RootStack.Navigator>
    <RootStack.Screen name='stack1' component={Stack1Navigator} />
    <RootStack.Screen name='stack2' component={Stack2Navigator} />
  </RootStack.Navigator>
}

有些数据是由这个屏幕产生的,我想把这些数据回传给navigator,如何用react-navigation v6把数据回传给navigator,以便在navigator内部用特定的功能处理?
我之所以问这个问题,是因为react-navigation不允许相反的方式(即,将导航器中定义的函数传递到屏幕),因为它不可序列化。
先谢谢你。

vyu0f0g1

vyu0f0g11#

当从Stack2返回到Stack1时,您希望传递param,对吗?
React导航v6支持:https://reactnavigation.org/docs/params/#passing-params-to-a-previous-screen
简单示例:https://snack.expo.dev/@pqv2210/q-74563374

相关问题