ルートページからタブ付きページに戻ると、奇妙なフリッカーが発生します

Question

アプリは簡単で、サイドメニューとタブを組み合わせています。私はそれが完璧に動作すると思ったが、root pageにナビゲートしてブラウザの前のボタンを押すとnavバーが奇妙にちらつくのを発見するまではなかった。

これは私がこれまでに取得していますoutputです。

Menu.ts

import { Component,ViewChild } from '@angular/core'; 
import { IonicPage, NavController, NavParams, Nav } from 'ionic-angular'; 

export interface PageInterface { 
    title: string; 
    pageName: string; 
    tabComponent?: any; 
    index?: number; 
    icon: string; 
} 

// Am I doing some mistakes in the following block? 
@IonicPage({ 
}) 
@Component({ 
    selector: 'page-menu', 
    templateUrl: 'menu.html' 
}) 

export class MenuPage { 

    rootPage ="TabsPage"; 

    @ViewChild(Nav) nav: Nav; 

    pages: PageInterface[]= [ 
     { title:'Tab 1', pageName: 'TabsPage', tabComponent: 'HomePage', index: 0, icon:'home' }, 
     { title:'Tab 2', pageName: 'TabsPage', tabComponent: 'SchedulePage', index: 1, icon:'timer' }, 
     { title:'Tab 3', pageName: 'TabsPage', tabComponent: 'CasesPage', index: 2, icon:'briefcase' }, 
    { title:'Non-Tab', pageName: 'SplashPage', icon:'information-circle' } 
     ] 

    constructor(public navCtrl: NavController, public navParams: NavParams) { 
    } 

    openPage(page: PageInterface) { 
    let params = {}; 

    if (page.index) { 
     params = { tabIndex: page.index}; 
    } 

    if (this.nav.getActiveChildNavs().length && page.index != undefined) { 
     this.nav.getActiveChildNavs()[0].select(page.index); 
     console.log('Else executed umdefined'); 
    } else { 
     // This is where I set new root page if it is not a tabbed page. 
    this.nav.setRoot(page.pageName, params).catch((err: any) => { 
     console.log(`Didn't set nav root: ${err}`); 
     }); 
    } 
    } 

    isActive(page: PageInterface) { 
    let childNav = this.nav.getActiveChildNavs()[0]; 

    if (childNav) { 
     if (childNav.getSelected() && childNav.getSelected().root === page.tabComponent) { 
     return 'primary'; 
     } 
     return; 
    } 

    if (this.nav.getActive() && this.nav.getActive().name === page.pageName) { 
     return 'primary'; 
    } 
    return; 
    } 

    ionViewDidLoad() { 
    console.log('MenuPage'); 
    } 
} 

Tabs.ts

​​

情報が十分でない場合は、プロジェクト全体がhere可能です。

更新 私はより明確に説明することはできませんが、あなたは問題がナビゲーションの履歴からであるように思わ非タブ付きのタブ付きページを切り替えるとプロジェクトを実行し、URLを観察しよう。あなたのapp.component.tsファイルで

Answer 1

、

rootPageとしてrootPage値を設定する： 'MenuPage'

とあなたのmenu.tsファイルでは、

rootPageとしてrootPage値を設定します。 'HomePage'（またはタブに表示するページ）。

このアプローチは私にとってはうまく機能します