ionic3/ionic4 ion-segment tab切换的使用

你懂的

ionic3/ionic4   ion-segment tab切换的使用是怎样的呢?下面来为大家揭晓答案：


在ionic3或者ionic4中可以用ion-segment组件实现tab切换，具体代码如下：

1. <ion-header>
   
2. 
   
3.   <ion-navbar>
   
4.    
   
5.     <ion-segment [(ngModel)]="tabs">
   
6.       <ion-segment-button value="plist">

复制代码

        商品
     

1. </ion-segment-button>
   
2.       <ion-segment-button value="pcontent">

复制代码

        详情
      

1. </ion-segment-button>     
   
2.     </ion-segment>
   
3. 
   
4.   </ion-navbar>
   
5. 
   
6. </ion-header>
   
7. 
   
8. 
   
9. <ion-content padding>
   
10. 
    
11.   <div [ngSwitch]="tabs">
    
12.     <div class="con1" *ngSwitchCase="'plist'">

复制代码

        商品图文信息
   

1. </div>
   
2. 
   
3.     <div class="con2" *ngSwitchCase="'pcontent'">

复制代码

        商品详情
   

1.   </div>
   
2.    
   
3.   </div>
   
4. 
   
5. </ion-content>

复制代码

了解更多ionic3相关资料见：https://www.itying.com/goods-460.html

幽梦林子