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

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

Answer 2

我相信您可以通过将screenProps传递给stackNavigator来实现。这样（假设您将堆栈导航器返回到某个地方）：

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

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

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

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

2 个答案: