如果Var on Storage不显示选项卡

时间:2018-05-05 18:45:04

标签: ionic-framework ionic3

我希望我的应用程序检查变量" myAccount"在本机存储上显示或不显示Tabs,我使用ionViewCanEnter检查变量 myAccount 是否存在于本地存储上,如果它不是 isConnected 将设置为false,如果其 isConnected 将设置为true 这是我的代码:

tabs.ts:

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { HomePage } from '../home/home';
import { NativeStorage } from '@ionic-native/native-storage';
import { MyaccountPage } from '../myaccount/myaccount';
/**
 * Generated class for the TabsPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-tabs',
  templateUrl: 'tabs.html',
})
export class TabsPage {
  public isConnected: Boolean= true;

  homeRoot = HomePage;
  myAccountRoot = MyaccountPage;
  rootPage = HomePage;

  constructor(public navCtrl: NavController, public navParams: NavParams, private nativeStorage: NativeStorage) {

  }



  ionViewCanEnter(){
    this.nativeStorage.getItem('myAccount')
    .then(
       //data => this.isConnected=false,
     // error => this.isConnected=true
      data => this.isConnected=true,
      error => this.isConnected=false
    );
  }
  logout(){
    this.nativeStorage.remove('myAccount');
    this.isConnected=false;
  }

}

如果 isConnected 为true,它将显示带有HomePage的选项卡,其中选项卡可见,如果不是它将显示没有选项卡的主页

tabs.html:

<ion-tabs selectedIndex="0" *ngIf="isConnected" class="tabs-icon-top tabs-color-active-positive">
  <ion-tab [root]="homeRoot"  tabIcon="home"> </ion-tab>
  <ion-tab [root]="myAccountRoot"  tabIcon="person"></ion-tab>
  <ion-tab [root]="myAccountRoot"  tabIcon="chatbubbles"></ion-tab>
  <ion-tab (ionSelect)="logout()"  tabIcon="power"></ion-tab>


</ion-tabs>
<ion-nav [root]="rootPage" *ngIf="!isConnected">{{isConnected}}</ion-nav>

问题是它不能完全正常工作,当 myAccount 添加到存储中时,标签不会显示但如果我退出应用程序并重新启动它们,它们会出现

1 个答案:

答案 0 :(得分:0)

使用了ionViewWillEnter,它可以正常工作