Lazy Loading - Tab not resetting


#1

Hi everyone,

Since integrating lazy loading into my application I’ve run into a few things I don’t understand.

The application I’m working on has a main with three pages in it. When I reload the page it tries to directly open the page it was on when reloaded instead of opening the first of the tab like in this repo.
The three tabs are workshop, timeline and companions. So if I reload when on the timeline page it tries to reopen timeline (Which is a problem).

Does anybody have an idea why my application would have this behavior or know how to stop it ?

Here are a few files I thought may be helpful.

Tabs.tsThe page containing the 3 tab pages workshop, timeline and companions

@IonicPage()
@Component({
  selector: 'page-tabs',
  templateUrl: 'tabs.html'
})
export class TabsPage {

  workshop = 'WorkshopPage';
  timeline = 'TimelinePage';
  companions = 'CompanionsPage';

  constructor(private myApp: MyApp, public navCtrl: NavController, public loadingCtrl: LoadingController, public events: Events) {
      console.log("Tabs constructor");

      this.events.subscribe('quest:refresh', () => {
        console.log("Quest event refresh");
        this.refreshQuest();
      });
  }

  ionViewDidEnter() {
    console.log('ionViewDidLoad Home - Tabs');
    //this.refreshQuest();

  }

  private refreshQuest() {}
}

tabs.htmlTemplate page for tabs.ts

<ion-tabs>
  <ion-tab [root]="workshop" tabIcon="workshop"></ion-tab>
  <ion-tab [root]="timeline" tabIcon="timeline"></ion-tab>
  <ion-tab [root]="companions" tabIcon="companions"></ion-tab>
</ion-tabs>

timeline.tsOne of the tabs (all constructed the same way)

@IonicPage()
@Component({
  selector: 'page-timeline',
  templateUrl: 'timeline.html'
})
export class TimelinePage {
  constructor(public navCtrl: NavController, private app: App, public events: Events) {
    console.log('Hello TimelinePage');
  }
}

app.component.ts

@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  rootPage: Component = "TabsPage";

  constructor(public platform: Platform, public app: App, public events: Events) {
    console.log("Hello App Component");
  }
}

Thanks for your answers and any help.
Afusa


#2

What exactly do you mean by “reload the page”, and how would a user do this with the app installed on device?