我有一个选项卡组：如何缓解标签点击？

<ion-tabs> 
    <ion-tab [root]="tab1Root" tabTitle="Programmes" tabIcon="icon-programmes"></ion-tab> 
    <ion-tab [root]="tab2Root" (ionSelect)="studioCheck()" tabTitle="Studio" tabIcon="icon-studio"></ion-tab> 
    <ion-tab [root]="tab3Root" tabTitle="Library" tabIcon="icon-library"></ion-tab> 
    <ion-tab [root]="tab4Root" tabTitle="Profile" tabIcon="icon-profile"></ion-tab> 
</ion-tabs>

当用户点击第二个选项卡（“工作室”），我需要检查，如果他们有机会获得它。如果他们这样做，很好，如果他们不这样做，我想显示吐司通知并加载第一个标签。

我该怎么做？

我以为return false就足够了studioCheck()，但事实并非如此。

打字稿：

studioCheck() { 
    console.log('Studio visited'); 

    // Grab studio selected level 
    this.storage.get('studio_level').then((val) => { 
     console.log('Storage queried'); 
     if(val) { 
     console.log('Level ID: ', val); 
     return true; 
     } else { 
     // No level selected 
     let toast = this.toastCtrl.create({ 
      message: 'Please choose a programme in order to use the Studio', 
      duration: 3000, 
      position: 'top' 
     }); 
     toast.present(); 
     this.navCtrl.parent.select(0); 
     return false; 
     } 
    }); 
    }

我想，也许ionSelect不等待异步调用storage.get，所以我只是在功能上做了return false;，但也不相同。

任何想法？

来源

2017-07-25 Mike

调整这样

<ion-tabs #tabs> 
    <ion-tab [root]="tab1Root" tabTitle="Programmes" tabIcon="icon-programmes"></ion-tab> 
    <ion-tab [root]="tab2Root" (ionSelect)="studioCheck()" tabTitle="Studio" tabIcon="icon-studio"></ion-tab> 
    <ion-tab [root]="tab3Root" tabTitle="Library" tabIcon="icon-library"></ion-tab> 
    <ion-tab [root]="tab4Root" tabTitle="Profile" tabIcon="icon-profile"></ion-tab> 
</ion-tabs>

视图，然后在控制器：

export class MyPage { 
    @ViewChild("tabs") public tabs: Tabs; 
    ... 

    studioCheck() { 
     console.log('Studio visited'); 

     // Grab studio selected level 
     this.storage.get('studio_level').then((val) => { 
      console.log('Storage queried'); 
      if(val) { 
       console.log('Level ID: ', val); 
       return true; 
      } else { 
       // No level selected 
       let toast = this.toastCtrl.create({ 
        message: 'Please choose a programme in order to use the Studio', 
        duration: 3000, 
        position: 'top' 
       }); 
       toast.present(); 
       this.tabs.select(0); 
      } 
     }); 
    } 
}

说明

以便在代码转换标签，必须GRAP的Tabs和呼叫实例那就是select。
请记住，选择该选项卡时会发出ionSelect，因此将忽略返回值。
由于this.storage.get，你的代码是异步，所以return false;不要离开studioCheck方法反正

来源

2017-07-25 17:42:30

这仍然具有相同的结果。原因是'this.storage.get'是异步的，因此该选项卡切换而不用等待存储调用。 – Mike

好耶选项卡开关，但它应该很快返回到第一个选项卡，以防止它受到限制..这就是“this.tabs.select（0）” –

的目的它失败，因为我要切换到的选项卡运行，这是我想要阻止的，因为存储器中有数据需要它不存在。我知道我可以在该页面添加逻辑来防止这种情况发生，但我希望有一种方法可以根本不打开标签，而不是打开然后关闭它。 – Mike

如何缓解标签点击？

回答

说明

相关问题