在特定子页面上隐藏Ionic TabBar（IONIC 3） [英] Hide Ionic TabBar on specific subpages (IONIC 3)

问题描述

我想在多个特定页面上隐藏我的标签栏。我的主要重点是将其隐藏在我的登录页面，注册页面和评论页面上。我已经尝试过tabsHideOnSubPages：true，但是当我这样做时，我的UserProfile页面
（这是一个子页面）隐藏了tabbar。 Tabbar也必须在UserProfile页面上可见，但在我之前提到的子页面（登录，注册等等）上也不会显示。

I want to hide my tabbar on multiple specific pages. My main focus is to hide it on my Login page, Register page, and a comment page. I have tried tabsHideOnSubPages: true, but when i do this my UserProfile page (which is a subpage) hides the tabbar. The tabbar must also be visible on the UserProfile page but then again not on my previous mentioned subpages (login, register etc..).

我目前正在使用Ionic Framework：离子角3.2.0

I am currently using Ionic Framework : ionic-angular 3.2.0

有谁知道我怎么解决这个问题？

Does anyone know how i can fix this?

推荐答案

我可以给你一个快速的修补程序。

I can give you a quick hotfix for that.

将此代码复制到你的.ts页面文件中。
该函数将在页面加载时执行。

Copy this Code into your .ts page file. The function will execute when the page is loaded.

如果你想隐藏标签栏，那么就行这段代码：

If you want to hide the tabbar then do this line of code:

tabs[key].style.display = 'none';

如果你想显示它，只需将'none'更改为'flex'即可使用此代码。

If you want to show it use this code by simply changing 'none' it to 'flex'.

tabs[key].style.display = 'flex';

此代码是一个角度函数，基本上意味着它在页面加载时执行。

This code is an angular function wich basicly means it executes when page is loaded.

ngAfterViewInit()

完整代码：

ngAfterViewInit() {
    let tabs = document.querySelectorAll('.show-tabbar');
    if (tabs !== null) {
        Object.keys(tabs).map((key) => {
            tabs[key].style.display = 'none';
        });
    }
}

您还可以使用此代码再次显示标签栏如果你离开页面。

You can also use this code to show the tabbar again if you leave the page.

    ionViewWillLeave() {
        let tabs = document.querySelectorAll('.show-tabbar');
        if (tabs !== null) {
            Object.keys(tabs).map((key) => {
                tabs[key].style.display = 'flex';
            });

        }
}

希望这有助于你。

这篇关于在特定子页面上隐藏Ionic TabBar（IONIC 3）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！