ionic 3 常用集-持續更新
阿新 • • 發佈:2018-12-23
1.隱藏返回鍵
<ion-header> <ion-navbar [hideBackButton]="true"> <ion-buttons start> <button ion-button icon-only color="light"> 取消 </button> </ion-buttons> <ion-title>{{navParams.data.title}}</ion-title> <ion-buttons end> <buttonion-button icon-only color="light" > 編輯 </button> </ion-buttons> </ion-navbar> </ion-header>
2.ionic2/3 頁面預設滾動到底部兩種方法:
方法1體驗不是很好,200毫秒的延遲視覺上可以看出來
方法2非同步的請求有時候不能及時響應(可以請求第一次後存入本地儲存裡面),經過測試 雖然ionic3 中本地儲存也是非同步的,但是毫無延遲(可能是比較快)
推薦1+2一起使用
1.使用 content 元件的 scrollToBottom() 方法,可以封裝成函式使用:
//頁面滾動到底部 scrollToBottom() { setTimeout(() => { if(this.content.scrollToBottom){ this.content.scrollToBottom(0); } },200) }
2..使用 content 元件的 scrollDownOnLoad 屬性:
<ion-content scrollDownOnLoad="true"></ion-content>