PhoneGap中文网

 找回密码
 立即注册
查看: 21874|回复: 1

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

[复制链接]

52

主题

528

帖子

1652

积分

金牌会员

Rank: 6Rank: 6

积分
1652
发表于 2017-12-5 12:44:57 | 显示全部楼层 |阅读模式
ionic3/ionic4   ion-segment tab切换的使用是怎样的呢?下面来为大家揭晓答案:


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


  1. <ion-header>

  2.   <ion-navbar>
  3.    
  4.     <ion-segment [(ngModel)]="tabs">
  5.       <ion-segment-button value="plist">
复制代码

        商品
     
  1. </ion-segment-button>
  2.       <ion-segment-button value="pcontent">
复制代码

        详情
      
  1. </ion-segment-button>     
  2.     </ion-segment>

  3.   </ion-navbar>

  4. </ion-header>


  5. <ion-content padding>

  6.   <div [ngSwitch]="tabs">
  7.     <div class="con1" *ngSwitchCase="'plist'">
复制代码

        商品图文信息
   
  1. </div>

  2.     <div class="con2" *ngSwitchCase="'pcontent'">
复制代码

        商品详情
   
  1.   </div>
  2.    
  3.   </div>

  4. </ion-content>
复制代码

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

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

站长推荐 上一条 /1 下一条

ionic4视频教程

Archiver|手机版|小黑屋| PhoneGap中文网 ( 京ICP备13027796号-1 )  

GMT+8, 2024-3-29 06:18 , Processed in 0.038999 second(s), 29 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表