直接上代码,然后说明。
<ion-tabs id="mainTab" selectedIndex="2">
<ion-tab [root]="tab1Root" tabTitle="诊断指标" tabIcon="information-circle"></ion-tab>
<ion-tab [root]="tab2Root" tabTitle="诊断分析" tabIcon="information-circle"></ion-tab>
<ion-tab [root]="tab3Root" tabTitle="首 页" tabIcon="md-bonfire"></ion-tab>
<ion-tab [root]="tab4Root" tabTitle="数据填报" tabIcon="contacts"></ion-tab>
<ion-tab [root]="tab5Root" tabTitle="我 的" tabBadge="2" tabBadgeStyle="danger" tabIcon="contacts"> </ion-tab>
</ion-tabs>
ionic2 tab常用的属性设置
Attr Type Desc
[root] Page tab将要加载的组件(也就是页面)
tabTitle string tab上显示出来的文字
tabIcon string tab上显示的图标,根据icon表填写最有的icon名字
tabBadge string tab上显示的角标数字,相当于微信中未读消息的条数那样的效果
tabBadgeStyle string 角标的颜色
enable boolean tab是否可用
show boolean 是否显示
[rootParams] object tab传递的参数
swipeBackEnabled boolean 是否支持滑动后退
tabsHideOnSubPages bollean 在子页面是否隐藏
selectedIndex number 这个是给ion-tabs设置的,设置默认显示那个组件