uni-app 下拉刷新 配置 手動調用 停止下拉刷新

onPullDownRefresh
在 js 中定義 onPullDownRefresh 處理函數（和onLaunch，onLoad，onShow等生命周期函數同級），監聽當前頁面用戶下拉刷新事件。

首先需要在 pages.json 里，找到的當前頁面的pages節點，並在 style 選項中開啟 enablePullDownRefresh。

{
    "pages": [
        {
            "path": "pages/index/index",
            "style": {
                "navigationBarTitleText": "uni-app",
                "enablePullDownRefresh": true,  //設置為true表示當前頁面開啟下拉刷新
                "backgroundTextStyle": "dark"  //下拉 loading 的樣式，僅支持 dark/light
            }
        }
    ],
    "globalStyle": {
        "navigationBarTextStyle": "white",
        "navigationBarBackgroundColor": "#0faeff",
        "backgroundColor": "#fbf9fe"
    }
}

　　

• 當處理完數據刷新后，uni.stopPullDownRefresh 可以停止當前頁面的下拉刷新。

uni.startPullDownRefresh(OBJECT)

開始下拉刷新，調用后觸發下拉刷新動畫，效果與用戶手動下拉刷新一致。(詳細參數說明請點擊uni.startPullDownRefresh(OBJECT)標題到uniapp官網查看)

 

uni.startPullDownRefresh(OBJECT)

在index.vue 停止當前頁面下拉刷新

export default {
    data: {
        text: 'uni-app'
    },
    onLoad: function (options) {
        setTimeout(function () {
            console.log('start pulldown');
        }, 1000);
        //uni.startPullDownRefresh();
        uni.startPullDownRefresh({
            success：function(res){
                console.log(res);  //success 返回參數說明
            }
        });  //這里表示當進入頁面的時候就開始執行下拉刷新動畫
    },
    onPullDownRefresh() {
        //監聽下拉刷新動作的執行方法，每次手動下拉刷新都會執行一次
        console.log('refresh');
        setTimeout(function () {
            uni.stopPullDownRefresh();  //停止下拉刷新動畫
        }, 1000);
    }
}

更多相關資料可以到uni-app官網查看文檔：http://uniapp.dcloud.io/api/ui/pulldown