web-dev-qa-db-fra.com

Comment ajouter un tiroir de barre latérale avec React Native Navigation v2?

Avec react-native-navigation v1, vous pouvez configurer un tiroir comme celui-ci:

drawer: {
    left: {
        screen: 'ScreenName'
    }
}

Dans les documents de React-Native-Navigation, ils mentionnent que le tiroir est toujours pris en charge, drawer support

mais là dans aucun exemple de son utilisation. J'ai essayé de la même manière que dans la v1, mais cela n'a pas fonctionné. Y a-t-il quelqu'un qui l'a atteint d'une manière ou d'une autre?

9
angelos_lex

Dans RNN V2, vous pouvez ajouter un tiroir en utilisant simplement sideMenu au lieu de l'ancienne option de tiroir Ex:

Navigation.events().registerAppLaunchedListener(() => {
  Navigation.setRoot({
    root: {
      sideMenu: {
        id: "sideMenu",
        left: {
          component: {
            id: "Drawer",
            name: "navigation.Drawer"
          }
        },
        center: {
          stack: {
            id: "AppRoot",
            children: [{
              component: {
                id: "App",
                name: "navigation.AppScreen"
              }
            }]
          }
        }
      }
    }
  });
}

Jetez un oeil à cela

et pour fermer le tiroir, utilisez Navigation.mergeOptions et passez visible faux comme ceci

<Button onPress={this.hideSideMenu}/>

hideSideMenu() {
  Navigation.mergeOptions(this.props.componentId, {
    sideMenu: {
      left: {
        visible: false
      }
    }
  });
}
17
devoka