content中的resize方法谊路，多少人知道和用過？
resize這個方法官方文檔有寫掰派，所以我以為沒什么特別怔毛，直至有幾人問我，才發(fā)現(xiàn)不少人是不知道這個東西的促王，所以還是寫一下犀盟。resize官網(wǎng)說明如下：
Tell the content to recalculate its dimensions. This should be called after dynamically adding/removing headers, footers, or tabs.
中文意思是動態(tài)添加/移除headers、footers或者tabs時蝇狼，重新計算content的維度阅畴。
但其功能不僅于此，它還包含headers迅耘、footers或者tabs自身維度的調整贱枣，還有內部元素的動態(tài)添加/移除。
怎么理解呢豹障？這樣說吧冯事，如果想把一個元素固定在頭部，可以放在headers里面血公，如果想固定在底部昵仅，可以放在footers里面，然而當把這個元素給刪除的時候（如使用*ngIf）累魔，它所撐開的headers或者footers空間是不會自動回收的摔笤，這樣就會顯示空白一片，這個時候垦写，遇到此問題的人吕世，一般第一反應是手動調整headers或者footers的高度樣式，如ngClass或者ngStyle.height等等梯投，然而不同平臺(ios命辖、android...)的值是不同的况毅，所以也不好處理。同理尔艇，當動態(tài)添加/移除headers尔许、footers時也面臨同樣空間處理問題。
針對這些情況终娃，官網(wǎng)早有方法：
this.content.resize();
對應官網(wǎng)例子：
@Component({
template: `
<ion-header>
<ion-navbar>
<ion-title>Main Navbar</ion-title>
</ion-navbar>
<ion-toolbar *ngIf="showToolbar">
<ion-title>Dynamic Toolbar</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<button ion-button (click)="toggleToolbar()">Toggle Toolbar</button>
</ion-content>
`})
class E2EPage {
@ViewChild(Content) content: Content;
showToolbar: boolean = false;
toggleToolbar() {
this.showToolbar = !this.showToolbar;
this.content.resize();
}
}
