TabNavigator, StackNavigator и DrawerNavigator в одном приложении - PullRequest
Новая
       24

TabNavigator, StackNavigator и DrawerNavigator в одном приложении

0 голосов
/ 19 декабря 2018

Я создаю мобильное приложение с vue-native, но у меня возникают некоторые проблемы с маршрутизацией с помощью TabNavigator, StackNavigator и DrawerNavigator.По сути, я хочу, чтобы мое приложение выглядело следующим образом: домашний экран (без выдвижного ящика и без вкладок)> экран входа в систему (без указателя перемещений и без вкладки)> первый экран (да, открывающий окно и да вкладка)> второй экран (да выдвижный ящик и да вкладчик) и т. Д ...

Мой App.vue выглядит так: 

<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>

Но я не могу заставить его работать.Мне постоянно говорят, что я, вероятно, забыл экспортировать его, но я не понимаю.У кого-нибудь есть подобное приложение и работающее приложение. С этими тремя компонентами вместе?

...