React Navigation 将参数传递给嵌套的 stackNavigator

Question

在 React Navigation 3.0 中，他们添加了将默认参数传递给屏幕的功能。问题是我想将这些参数传递给嵌套的 stackNavigator，但我不知道该怎么做。这些是我的导航器： MainDrawer.js:

    const MyDrawerNavigator = createDrawerNavigator({
      Anime: {
        screen: SerieNavigation,
        params: { type: "anime" },
        path: "anime/:anime"
      },
      Tv: {
        screen: SerieNavigation,
        params: { type: "tv-show" },
        path: "tv/:tv"
      },
      Film: {
        screen: SerieNavigation,
        params: { type: "film" },
        path: "film/:film"
      }
    });

    const AppContainer = createAppContainer(MyDrawerNavigator);

    export default AppContainer;

SerieNavigation.js:

    const SerieStack = createStackNavigator(
      {
        Content: {
          screen: SearchScreen,
          params: { type: "anime" } //<-- HERE I WOULD LIKE TO DO SO params: { type: props.navigation.state.params.type }
        },
        Serie: SearieScreen,
        Episode: EpisodePage
      },
      {
        headerMode: "none",
        navigationOptions: {
          headerVisible: false
        }
      }
    );

    SerieStack.defaultNavigationOptions = {};
    export default SerieStack;

感谢任何帮助。

Answer 1

我相信您可以通过将 screenProps 传递给 stackNavigator 来实现这一点。像这样（假设你 return 你的堆栈导航器在某处）：

render() {
  <MyDrawerNavigator screenProps={this.props} />
}

然后，您可以像这样在 SerieStack 中访问它：

const SerieStack = createStackNavigator(
{
  Content: {
    screen: SearchScreen,
    params: { type: this.props.screenProps.navigation.state.params.type }
  }
});

Answer 2

要访问父项的道具，您可以使用 this.props.navigation.dangerouslyGetParent().getParam('type'); 现在您可以访问父级的任何道具。

编辑：

不确定这是否适用于 react-navigation v5，但请尝试一下

React Navigation 将参数传递给嵌套的 stackNavigator

React Navigation pass params to nested stackNavigator

react-native

react-navigation

expo

stack-navigator