wake-up-neo.com

Wie füge ich Sidebar Drawer mit React Native Navigation v2 hinzu?

Mit react-native-navigation v1 können Sie eine Schublade wie folgt einrichten:

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

In Dokumenten der React-Native-Navigation wird erwähnt, dass Drawer weiterhin unterstützt wird, drawer support

aber es gibt kein Beispiel für seine Verwendung. Ich habe es auf die gleiche Weise wie in Version 1 versucht, aber es hat nicht funktioniert. Gibt es jemanden, der es irgendwie erreicht hat?

react-native-navigationwix-react-native-navigationreact-native-navigation-v2
9
angelos_lex

In RNN V2 können Sie Drawer hinzufügen, indem Sie einfach sideMenu anstelle der alten Drawer-Option verwenden. Beispiel:

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"
              }
            }]
          }
        }
      }
    }
  });
}

Schau dir das an

und um die Schublade zu schließen, benutze Navigation.mergeOptions und übergebe so visible false

<Button onPress={this.hideSideMenu}/>

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