ionic2-页面的生命周期

onPageLoaded   onPageWillEnter  onPageDidEnter   onPageWillLeave   onPageDidLeave
ionViewLoaded  ionViewWillEnter ionViewDidEnter  ionViewWillLeave  ionViewDidLeavejavascript

 上下2种写法在beta37中都有效html

假如在about页面中的控制台中打印页面加载完成,将要进入,已经进入,将要离开,已经离开java

在about.ts文件夹中ionic

export class AboutPage {
ionViewLoaded(){
  console.log("about loaded lo")
  }
  onPageWillEnter(){
  console.log("about will endter")
  }
    onPageDidEnter(){
  console.log("about did endter")
  }
   onPageWillLeave(){
  console.log("about will Leave")
  }
  onPageDidLeave(){
  console.log("about did Leave")
  }
}

下面的例子为默认第二个tab显示ui

<ion-tabs #myTabs>
	<ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home" tabBadge="3" tabBadgeStyle="danger"></ion-tab>
	<ion-tab [root]="tab2Root" tabTitle="关于" tabIcon="information-circle"></ion-tab>
	<ion-tab [root]="tab3Root" tabTitle="用户中心" tabIcon="person"></ion-tab>
</ion-tabs>

html页面中直接写#myTabs 表明id号,不要写id="myTabs"this

import {Component} from '@angular/core';
import {HomePage} from '../home/home';
import {AboutPage} from '../about/about';
import {ContactPage} from '../contact/contact';
import {Tabs} from 'ionic-angular';
import {Injectable,ViewChild} from '@angular/core';

@Component({
  templateUrl: 'build/pages/tabs/tabs.html'
})
export class TabsPage {
  @ViewChild('myTabs') tabRef:Tabs;
  private tab1Root: any;
  private tab2Root: any;
  private tab3Root: any;

  constructor() {
    // this tells the tabs component which Pages
    // should be each tab's root Page
    this.tab1Root = HomePage;
    this.tab2Root = AboutPage;
    this.tab3Root = ContactPage;
  }
  ionViewDidEnter(){
    this.tabRef.select(1);
  }
}
相关文章
相关标签/搜索