我已经创建了选项卡页面,并通过选择器包含在我的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>
4条答案
按热度按时间vulvrdjw1#
如果您指的是特定的路由,则可以订阅Router并在App组件控制器中设置布尔标志
应用程序.组件.ts
应用程序.组件.html
gzszwxb42#
对于Ionic 6,我创建了一个非常好用的生命周期钩子,您也可以手动将生命周期钩子添加到每个页面,但这对于可重用性来说更好。
可以像
useHideIonTabBar()
一样在页面组件中使用,以隐藏标签栏ovfsdjhp3#
将不需要显示标签栏的路由放在ion-routeroutlet标签栏下方
kr98yfug4#
有一个简单的方法来实现这一点-移动路线,你想隐藏标签栏到标签模块,外面的标签子路线。
假设您有一个“事件”模块,并且此路由在其自己的路由模块中定义:
将此路由移动到标签路由模块将隐藏页面上的标签栏。