TabNavigator, StackNavigator et DrawerNavigator dans une application

voix
0

Je construis une application mobile avec vue natif, mais je suis en cours d'exécution dans certains problèmes avec le routage avec TabNavigator, StackNavigator et DrawerNavigator. Fondamentalement, je veux que mon application pour ressembler à ceci: l'écran d'accueil (pas drawernavigator et pas tabnavigator)> loginscreen (pas drawernavigator et pas tabnavigator)> firsttabscreen (oui drawernavigator et oui tabnavigator)> secondtabscreen (oui drawernavigator et oui tabnavigator) etc ...

Mon App.vue est à la recherche comme ceci:

<template>
 <root>
      <app-navigation></app-navigation>
 </root>
</template>


<script>
     import Vue from vue-native-core;
     import React from react;
     import { StackNavigator, DrawerNavigator, TabNavigator, TabBarBottom, navigationService } from vue-native-router;
     import { Root } from native-base;
     import HomeScreen from ./views/home.vue;
     import LoginScreen from ./views/login.vue;
     import Tabscreen1 from ./views/tabscreen1.vue;
     import Tabscreen2 from ./views/tabscreen2.vue;
     import Sidebar from ./views/sidebar.vue;


     const Drawer = DrawerNavigator(
             {
                  tabscreen1: { screen: tabscreen1screen },
                  tabscreen2: { screen: tabscreen2screen }
             },
             {
                  contentComponent: props => <Sidebar {...props} />
             }
     );

     const tabNav = TabNavigator(
             {
                  tabscreen1: { screen: tabscreen1screen},
                  tabscreen2: { screen: tabscreen2screen },
             },
             {
                  tabBarPosition: bottom,
                  tabBarComponent: TabBarBottom
             }
     );

     const AppNavigation = StackNavigator(
             {
                  Home: { screen: HomeScreen },
                  Login: { screen: LoginScreen },
                  Drawer: { screen: Drawer },
                  tabNav: { screen: tabNav }
             },
             {
                  initialRouteName: Home,
                  headerMode: none
             }
     );


     export default {
          components: { Root, AppNavigation }
     };
</script>

Mais je ne peux pas le faire fonctionner. Il continue à me dire que j'ai oublié susceptibles d'exporter, mais je ne comprends pas. Quelqu'un at-il une application similaire et un App.Vue travaillant avec ces 3 composants ensemble?

Créé 19/12/2018 à 14:10
source utilisateur
Dans d'autres langues...                            

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more