Ionic 2 - 屏幕闪光灯

Question

我有一个登录页面和一个主页.我使用本机存储来设置项目,该项目将检查用户是否已登录(Facebook或Google身份验证).如果该项具有值(此检查发生在app.componenet.ts中),则会直接导航到主页.一旦用户登录并且如果恰好最小化应用程序并且在一段时间之后.当用户再次打开应用程序时,在加载几秒后,我会看到登录屏幕(用户已经登录时不应该看到)1秒钟,然后导航到主页.

这是我的app.component.ts

import { Component, ViewChild } from '@angular/core';
import { Platform, Nav, AlertController } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { LoginPage } from '../pages/login/login';
import { NativeStorage } from '@ionic-native/native-storage';
import { TabsPage } from '../pages/tabs/tabs';
import { Facebook } from 'ionic-native';
import { GooglePlus } from '@ionic-native/google-plus';
@Component({
  templateUrl: 'app.html',

})
export class MyApp {
  @ViewChild(Nav) nav: Nav;
  rootPage: any = LoginPage;

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, private nativeStorage: NativeStorage, private alertCtrl: AlertController, private googlePlus : GooglePlus) {
    platform.ready().then(() => platform.ready().then(() => {
      this.nativeStorage.getItem("userId").then((data) => {
        console.log(data.userExists);
        this.rootPage = TabsPage;
        this.nav.push(TabsPage);

      }, (error) => {
        console.log("No data in storage");
        this.nav.push(LoginPage);
      })
      statusBar.styleDefault();
      splashScreen.hide();
    })

    )
  }

}

Answer 1

这是因为您首先将LoginPage分配给rootPage

rootPage: any = LoginPage;

然后在承诺解决后再次设置它:

this.rootPage = TabsPage;

为了解决这个问题,首先将rootPage初始化为null,然后在解析promise时使用正确的页面初始化它:

@Component({
  templateUrl: 'app.html',
})
export class MyApp {
  @ViewChild(Nav) nav: Nav;
  rootPage: any = null; // <- I've changed this line

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, private nativeStorage: NativeStorage, private alertCtrl: AlertController, private googlePlus : GooglePlus) {
    platform.ready().then(() => platform.ready().then(() => {
      this.nativeStorage.getItem("userId").then((data) => {
        console.log(data.userExists);
        this.rootPage = TabsPage;
        // this.nav.push(TabsPage); <- You don't need this line

      }, (error) => {
        console.log("No data in storage");
        // this.nav.push(LoginPage); <- Remove this line too :)
        this.rootPage = LoginPage; // <- Set the LoginPage as root
      })
      statusBar.styleDefault();
      splashScreen.hide();
    })

    )
  }

}

还请注意我已经更改了几行.将其设置为根页后,无需推送页面.另一个变化是,如果你想首先显示LoginPage(因为用户还没有登录),它应该被设置为rootPage(而不是被推送).