ionic學習(十一):頁面下拉重新整理(Refresher)
阿新 • • 發佈:2018-11-22
官網參考:
https://ionicframework.com/docs/api/components/refresher/Refresher/
用法說明:
在html頁面需要下拉重新整理的位置新增如下程式碼:
<!-- 下拉重新整理 --> <ion-refresher (ionRefresh)="doRefresh($event)"> <ion-refresher-content pullingIcon="arrow-dropdown" pullingText="下拉重新整理" refreshingSpinner="circles" refreshingText="載入中..."> </ion-refresher-content> </ion-refresher>
在ts頁面設定函式doRefresh()
//下拉重新整理函式
doRefresh(refresher) {
console.log('Begin async operation', refresher);
setTimeout(() => {
console.log('資料重新整理!');
//重新整理時需要呼叫的函式寫這裡
refresher.complete();
}, 2000);
}
------end-----