标签: ionic-tabs

我正在做一个Ionic 4项目，我已经生成了一个tabs项目。

我要做的是创建一个登录页面，这是默认页面。

用户成功登录后，我想导航至选项卡。

当我尝试执行此操作时，出现错误：

Error: Cannot match any routes. URL Segment: 'tabs'

这些是我的路线：

const routes: Routes = [
  { path: '', loadChildren: './login/login.module#LoginPageModule' },
  { path: 'Login', loadChildren: './login/login.module#LoginPageModule' },
  { path: 'tabs', loadChildren: './tabs/tabs.module#TabsPageModule' },
];

在我的登录页面中，我有一个按钮，如下所示：

<ion-button expand="block" [href]="'tabs'" color="light" fill="outline">Sign in</ion-button>

当我生成其他页面时，我可以使用相同的方式导航到该页面。

这是我想要实现的,我已经登录到我的应用程序,但当我退出时,选项卡仍然存在,直到我在我的登录屏幕刷新我的页面,我希望它从我的登录屏幕,当我注销如何,什么我错过了吗？这是我做的:

我的app.component.ts:

export class MyApp {
  public rootPage: any = TabsPage;

  constructor(platform: Platform) {

    if (localStorage.getItem("currentUser") === null) {
      console.log("not logged in");
        this.rootPage = LoginPagePage;
    } else {
      console.log("already logged in");
        this.rootPage = TabsPage;
    }

    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      StatusBar.styleDefault();
      Splashscreen.hide();
    });
  }
}

下面是我的tabs.ts:

export class TabsPage {

  public tab1Root: any;
  public tab2Root: any;
  public …

我想在键盘打开时隐藏我的标签,并在键盘关闭时再次显示标签.

我知道我可以只使用"AdjustSpan",就是这样,但问题是,如果我这样做,键盘也会隐藏我的聊天输入,因为它是一个页脚.

什么是隐藏标签的最佳方法？

我已经尝试使用[ngClass],我尝试使用Keyboard.disableScroll,也使用参数scrollAssist和autoFocusAssist使用false值来测试app.module.ts ...

似乎没什么用.

知道如何隐藏标签？

先感谢您!!

我已经创建了选项卡页面并通过选择器包含在我的 app.component.html 文件中，我的问题是我想在某些特定页面中隐藏选项卡，任何人都可以帮助我。下面我分享我创建的标签页的代码。

标签页.html

        <ion-tabs>
            <ion-tab-bar slot="bottom">
                 <ion-tab-button tab="home">
                   <ion-icon name="home"></ion-icon>
                <ion-label>Home</ion-label>
            </ion-tab-button>
    
            <ion-tab-button tab="search">
                <ion-icon name="search"></ion-icon>
                <ion-label>Search</ion-label>
            </ion-tab-button>
    
            <ion-tab-button tab="click-history">
                <ion-icon name="color-wand"></ion-icon>
                <ion-label>Clicks</ion-label>
            </ion-tab-button>
    
            <ion-tab-button tab="profile">
                <ion-icon name="person"></ion-icon>
                <ion-label>Profile</ion-label>
            </ion-tab-button>
        </ion-tab-bar>
    </ion-tabs>

应用程序组件.html

    <ion-app>
        <app-menu></app-menu>
        <ion-router-outlet id="main"></ion-router-outlet>
        <app-tab></app-tab>
    </ion-app>

我正在构建一个离子应用程序,我在底部使用离子选项卡导航整个应用程序..我想添加自定义svg作为选项卡图标.我不知道如何做到这一点,但如果有任何解决方案,请提供链接或代码或文档的任何参考.

嗨,您好!!我正在构建一个离子应用程序,我在底部使用离子选项卡导航整个应用程序..我想添加自定义svg作为选项卡图标.我不知道如何做到这一点,但如果有任何解决方案,请提供链接或代码或文档的任何参考.

我还想在离子标签中添加头像.

我是ionic2的新手，我想从特定页面中删除标签。我正在使用以下代码：

import { NavController, App } from 'ionic-angular';

constructor(public navCtrl: NavController, public app: App){

this.navCtrl.push(MainPage);
}

但是只要使用上述代码，所有页面标签都会被删除。我只想删除特定页面。请帮我....