在 Nativescript 中隐藏底部导航栏答案

【问题标题】：Hide BottomNavigation bar in Nativescript在 Nativescript 中隐藏底部导航栏
【发布时间】：2021-02-20 18:25:09
【问题描述】：

我使用的是 Nativescript 7+，我想在导航到某些页面后隐藏 TabStrip。下面是我的.html 代码。

<BottomNavigation id="bottomNav">
    <TabStrip>
        <TabStripItem iconSource="font://&#xf015;" title="title1" class="fa tabstripitem"></TabStripItem>
        <TabStripItem iconSource="font://&#xf015;" title="title2" class="fa tabstripitem"></TabStripItem>
        <TabStripItem iconSource="font://&#xf015;" title="title3" class="fa tabstripitem"></TabStripItem>
        <TabStripItem iconSource="font://&#xf015;" title="title4" class="fa tabstripitem"></TabStripItem>
    </TabStrip>

    <TabContentItem>
        <page-router-outlet name="outlet1"></page-router-outlet>
    </TabContentItem>
    <TabContentItem>
        <page-router-outlet name="outlet2"></page-router-outlet>
    </TabContentItem>
    <TabContentItem>
        <page-router-outlet name="outlet3"></page-router-outlet> 
    </TabContentItem>
    <TabContentItem>
        <page-router-outlet name="outlet4"></page-router-outlet>
    </TabContentItem>
</BottomNavigation>

我尝试过使用：

let bottomBar = <BottomNavigation>Application.getRootView();

if (bottomBar.android) {
    bottomBar.tabStrip.visibility = Visibility.hidden;
} else {
    bottomBar.viewController.tabBar.hidden = true;
}

但是，bottomBar.tabStrip.visibility = Visibility.hidden; 隐藏了整个选项卡（白页）。我正在安卓手机上测试。

【问题讨论】：

标签： android angular nativescript bottomnavigationview

【解决方案1】：

这样使用

if (isAndroid) {
this.bottomNavBar.android.bottomNavigationBar.setVisibility(android.view.View.GONE)
} else {
     this.bottomNavBar.ios.tabBar.hidden = true;
}

【讨论】：

请分享bottomNavBar的声明。我试过let bottomNavBar: BottomNavigation; 或``` let bottomBar = Application.getRootView();```，我得到错误TypeError: Cannot read property 'setVisibility' of undefined。
给一个 id 并像这样使用 this.page.getViewById("bottomNavBar") 作为 BottomNavigation;
android.view.View.GONE 带来错误Cannot read property 'android' of undefined。即使安装了@nativescript/types，我似乎也无法正常工作。