viewDidLoad fires at every tab change

#1

Hello,

I’m trying to make an app with ionic 2, I’m almost done but I have some behaviours I don’t really understand.

I have a main page with 4 tabs.
Each tab is a view.

In my views i have some code in ionViewDidLoad and ionViewDidEnter and i see thoses funcions are called at every tab change, for every tabs, whatever the selected tab is.

Is this the normal behavior ? Isn’t ionViewDidLoad supposed to run only when the view is shown for the first time, and ionViewDidEnter only when the view is shown ?

What am I supossed to use to run code only when the tab is actually selected ?

I updated ionic just now and my package.json to see if it was a bug that may have been corrected with the official release, but I still have this behavior.

MainPage.ts :

 ...

@ViewChild('tabs') tabs: Tabs;

pages = [
    { root: RallyePage, icon: "icon-picto_menu_map"},
    { root: QuizzPage, icon: "icon-picto_menu_quizz", b:true},
    { root: ClassementPage, icon: "icon-picto_menu_ranking"},
    { root: MorePage, icon: "icon-picto_menu_more"}
];

...

MainPage.html :

...

<ion-content>
    <ion-tabs #tabs>
        <ion-tab *ngFor="let p of pages" [tabIcon]="p.icon" [root]="p.root" [tabBadge]="(p.b && !quizz.ended) ? '!' : ''">                </ion-tab>
    </ion-tabs>
</ion-content>

...

RallyePage.ts :

...

ionViewDidLoad() {
    this.loadMap();
    console.log('loaded at every tab change');
}

ionViewDidEnter(){
    console.log('enter at every tab change');
}

...

Thank you in advance for your help !

2 Likes
#2

I have exactly the same issue. Did you find a resolution in the end? This still occurs with Ionic 3!