web-dev-qa-db-ja.com

React Navigation pass params tonested stackNavigator

反応ナビゲーション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;

どんな助けでもありがたいです。

5
Leonardo Drici

ScreenPropsをstackNavigatorに渡すことでそれを実現できると思います。このように(スタックナビゲーターをどこかに返すと仮定):

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

次に、SerieStack内で次のようにアクセスできます:

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