Segment系统组件使用

我想要构建这样的一个界面效果，头部选项卡选择使用segment组件来制作。

image.png

在制作这个页面时，有几个点需要考虑：
1、点击头部选项卡时，下面列表如何同步改变？
2、切换到不同的选项卡，下面列表的滚动条位置不同，如何保留？
3、能否打开特定选项卡页面？

方案一（失败）

  
    
      
                
              
    
    
      标题
    
  
  
    
      选择1
      选择2
    
  



  
    
    
  

  
    

      
    
  

  
    

      
    
  

  
    
    
  

bug：当向上拖动后，如果想要想下拖动，返回头部时，会把ion-refresher给拉出来

方案二（成功）

  
    
      
                
              
    
    
      标题
    
  
  
    
      选择1
      选择2
    
  



  
    
    
  

  

      
    

  
    

      
    
  

  
    
    
  



  
    
    
  

    

      
    

  
    
    
  

只是这样还不够，当页面中有多个ion-content组件时，push的动画效果会出现问题，需要在app.module.ts文件中修改整站页面切换效果:

    IonicModule.forRoot(MyApp, {
      ...
      pageTransition:"md-transition"
      ...
    })

设置打开特定选项卡

//目标页面
  private type:string="all";
  constructor(public navCtrl: NavController, public navParams: NavParams) {
    let deftype = this.navParams.get("deftype");
    if (typeof deftype != "undefined" && deftype != "") {
      this.type = deftype;
    }
  }
  
//跳转页面
this.navCtrl.push("pagename",{deftype:"默认选项值"})