Как отобразить Ionic Tabs на всех страницах? - PullRequest
Новая
       15

Как отобразить Ionic Tabs на всех страницах?

0 голосов
/ 02 февраля 2019

В настоящее время я разрабатываю мобильное приложение с Ionic 4. Я создаю его с помощью Ionic CLI, но я сделал пустой проект.Я создал какой-то компонент (например, login, signup ...) и после этого добавил вкладки от Ionic.

Моя проблема в том, что вкладки Ionic присутствуют только на страницах в tabs.router.module.ts.Как сделать так, чтобы вкладки отображались на всех страницах?

Кроме них, каждый компонент находится в app-routing.module.ts, я пытался вырезать и вставлять их в tabs.router.module.ts, но я 'Я не уверен, что это хорошая вещь.

tabs.routes.module.ts 

const routes: Routes = [
  {
    path: 'tabs',
    component: TabsPage,
    children: [
      {
        path: 'home',
        children: [
          {
            path: '',
            loadChildren: '../home-page/tab1.module#HomePageModule'
          }
        ]
      },
      {
        path: 'game/new',
        children: [
          {
            path: '',
            loadChildren: '../game/create-game-page/tab2.module#CreateGamePageModule'
          }
        ]
      },
      {
        path: '',
        redirectTo: '/tabs/home',
        pathMatch: 'full'
      }
    ]
  },
  {
    path: '',
    redirectTo: '/tabs/home',
    pathMatch: 'full'
  }
];

На данный момент мои вкладки работают, но я не уверен, что понимаю, как они отличноРабота.Спасибо за вашу помощь.

1 Ответ

0 голосов
/ 25 апреля 2019

Если вы хотите, чтобы ваши вкладки отображались на каждой странице, поместите их в файл app.component.html.Например: 

<ion-app>
 <ion-tab-button tab="tab1">
    <ion-label>Label1</ion-label>
    <ion-icon name="search"></ion-icon>
  </ion-tab-button>
  <ion-tab-button tab="tab2">
    <ion-label>Label2</ion-label>
    <ion-icon name="card"></ion-icon>
  </ion-tab-button>
</ion-app>

Не забудьте создать свои маршруты и свою маршрутизацию прямо сейчас в своем app-routing.module.ts.

...