时间戳

首页 > 解决方案 > 我在尝试导航到未捕获的标签页时遇到此错误（承诺）：无效链接：TabsPage

javascript - 我在尝试导航到未捕获的标签页时遇到此错误（承诺）：无效链接：TabsPage

问题描述

如果用户已登录，我有一个关于导航到 theTabs 页面的问题。在最后一个代码块中，导航到 LoginPage （如果 firebase 中没有用户）有效，但如果用户已登录，那么如果应该被引导到 TabsPage，它给了我“未捕获（承诺）：无效链接：TabsPage”的错误。

*这是我的 app.component.ts 文件**

import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { LoginPage } from '../pages/login/login';
import { UserprofilePage } from '../pages/userprofile/userprofile';
import { TabsPage } from '../pages/tabs/tabs';
import firebase from 'firebase/app';
import 'firebase/auth';
import { FIREBASE_CONFIG } from './credentials';




@Component({
templateUrl: 'app.html'
})
export class MyApp {


rootPage:any;


constructor(platform: Platform, statusBar: StatusBar, splashScreen: 
SplashScreen ) {
platform.ready().then(() => {
  // Okay, so the platform is ready and our plugins are available.
  // Here you can do any higher level native things you might need.
  statusBar.styleDefault();
  splashScreen.hide();

});

if (!firebase.apps.length) {
    firebase.initializeApp(FIREBASE_CONFIG);
}
const unsubscribe = firebase.auth().onAuthStateChanged(user => {
  if (!user) { //if user doesn't exist
    this.rootPage = 'LoginPage';
    unsubscribe();
  } else { //if user is true, logged in
    this.rootPage= 'TabsPage';
    unsubscribe();
  }
});



}
}

这是我的 tabs.ts

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { AboutPage } from '../about/about';
import { ContactPage } from '../contact/contact';
import { HomePage } from '../home/home';
import {UserprofilePage} from '../userprofile/userprofile';
import { IonicPage } from 'ionic-angular';


@Component({
templateUrl: 'tabs.html'
})
export class TabsPage {

tab1Root = HomePage;
tab2Root = UserprofilePage;
tab3Root = ContactPage;

constructor() {

}



}

标签： javascriptangularionic-framework

解决方案

您在 app.component.ts 中使用带有字符串的语法，就好像您的应用程序使用组件/页面的延迟加载一样。

但是根据您的导入（您正在导入组件的事实）意味着您正在使用非延迟加载方法。

通过分配组件而不是字符串来修复它：

const unsubscribe = firebase.auth().onAuthStateChanged(user => {
  if (!user) { //if user doesn't exist
    this.rootPage = LoginPage;
    unsubscribe();
  } else { //if user is true, logged in
    this.rootPage= TabsPage;
    unsubscribe();
  }
});

推荐阅读