javascript - Ionic 2 正在加载过时的组件

Question

这是我的页脚组件。我从页脚栏中调用几页，如下所示。当我单击页脚时，它正在加载过时的组件。我调试了它，发现它没有调用组件的构造函数(我有加载逻辑来刷新数据)。我必须从页脚单击两次才能调用组件才能获取正确的数据

tab-footer.component.html

  <ion-tabs>
    <ion-tab [root]="home" tabIcon="md-home" 
   [rootParams]="homeparams"></ion-tab>
     <ion-tab [root]="alertsPage" tabIcon="md-notifications-outline">
    </iontab>
   <ion-tab [root]="flagged" tabIcon="flag"></ion-tab>
  </ion-tabs>


  @Component({
   selector: 'app-tab-footer',
   templateUrl: './tab-footer.component.html',
  styleUrls: ['./tab-footer.component.scss']
  })
  export class TabFooterComponent {

  home = HomeComponent;
  alertsPage = AlertsComponent;
  flagged = FlaggedComponent;
  homeparams: any;

  constructor(public navparam: NavParams) {
    this.homeparams = navparam;
   }

 }

这是我从页脚调用的组件之一

  @Component({
 selector: 'app-flagged',
 templateUrl: './flagged.component.html',
  styleUrls: ['./flagged.component.scss']
})
export class FlaggedComponent {

    someData1: any;
    someData:any[] = [];

    someObj = {}

 constructor(public someService: SomeServiceService,
     public exampleService: ExampleService,
     public navParams: NavParams,
     public navCtrl: NavController) {

   // some loading logic
   }

任何人都可以帮忙找出为什么它不每次都调用构造函数吗？ 我是否指定了一些属性来加载它？ 谢谢

Answer 1

将生命周期事件 ionViewDidEnter 或 ionViewWillEnter 添加到您的 FlaggedComponent 类，并将更新或加载逻辑从构造函数移动到这些方法之一.

ionViewDidEnter() {
  console.log('the page has entered');
}

ionViewWillEnter() {
  console.log('the page is about to enter');
}

ionViewDidEnter is called when the page has fully entered and is now the active page. This event will fire, whether it was the first load or a cached page.

ionViewWillEnter is called when the page is about to enter and become the active page.

引用:https://ionicframework.com/docs/api/navigation/NavController/#lifecycle-events