來點好玩的吧，Ionic3頁面的生命周期是一個很重要的東西戳寸。我腦子笨，每次都要查一查拷泽。為了方便自己查詢疫鹊，寫下以下文字。
下面就是摘自ionic3官方文檔里面關(guān)于頁面生命周期的部分：
| Page Event | Returns | Description |
|---|---|---|
ionViewDidLoad |
void | Runs when the page has loaded. This event only happens once per page being created. If a page leaves but is cached, then this event will not fire again on a subsequent viewing. The ionViewDidLoad event is good place to put your setup code for the page. |
ionViewWillEnter |
void | Runs when the page is about to enter and become the active page. |
ionViewDidEnter |
void | Runs 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. |
ionViewWillLeave |
void | Runs when the page is about to leave and no longer be the active page. |
ionViewDidLeave |
void | Runs when the page has finished leaving and is no longer the active page. |
ionViewWillUnload |
void | Runs when the page is about to be destroyed and have its elements removed. |
ionViewCanEnter |
boolean/Promise<void> | Runs before the view can enter. This can be used as a sort of "guard" in authenticated views where you need to check permissions before the view can enter |
ionViewCanLeave |
boolean/Promise<void> | Runs before the view can leave. This can be used as a sort of "guard" in authenticated views where you need to check permissions before the view can leave |
總共有八個司致，其中常用的有六個拆吆，翻譯并列成表格出來：
| Event | Desc |
|---|---|
ionViewDidLoad |
當(dāng)頁面加載的時候觸發(fā)，僅在頁面創(chuàng)建的時候觸發(fā)一次脂矫，如果被緩存了枣耀，那么下次再打開這個頁面則不會觸發(fā) |
ionViewWillEnter |
顧名思義，當(dāng)將要進(jìn)入頁面時觸發(fā) |
ionViewDidEnter |
當(dāng)進(jìn)入頁面時觸發(fā) |
ionViewWillLeave |
當(dāng)將要從頁面離開時觸發(fā) |
ionViewDidLeave |
離開頁面時觸發(fā) |
ionViewWillUnload |
當(dāng)頁面將要銷毀同時頁面上元素移除時觸發(fā) |
可以測試下結(jié)果：
ionViewDidLoad(){
console.log("1.0 ionViewDidLoad 當(dāng)頁面加載的時候觸發(fā)庭再，僅在頁面創(chuàng)建的時候觸發(fā)一次捞奕，如果被緩存了，那么下次再打開這個頁面則不會觸發(fā)");
}
ionViewWillEnter(){
console.log("2.0 ionViewWillEnter 顧名思義佩微，當(dāng)將要進(jìn)入頁面時觸發(fā)");
}
ionViewDidEnter(){
console.log("3.0 ionViewDidEnter 當(dāng)進(jìn)入頁面時觸發(fā)");
}
ionViewWillLeave(){
console.log("4.0 ionViewWillLeave 當(dāng)將要從頁面離開時觸發(fā)");
}
ionViewDidLeave(){
console.log("5.0 ionViewDidLeave 離開頁面時觸發(fā)");
}
ionViewWillUnload(){
console.log("6.0 ionViewWillUnload 當(dāng)頁面將要銷毀同時頁面上元素移除時觸發(fā)");
}
ionViewCanEnter(){
console.log("ionViewCanEnter");
}
ionViewCanLeave(){
console.log("ionViewCanLeave");
}
對比下結(jié)果就很清楚他們之間的區(qū)別了
demo的結(jié)果
