微信小程序下拉刷新和加載更多的代碼封裝

不少頁面除了接口地址和模板不同外,幾乎是類似的,好比用戶的收益頁面、提現記錄頁面,都是默認顯示第一頁數據,下拉刷新,加載更多,徹底能夠封裝。api

使用的時候這樣就行了app

const app = getApp();

var refreshLoad = app.refreshLoad(app).setApiName("getWithdrawList");

Page(refreshLoad);

庫的封裝代碼this

var x = {};

var app = null;

var apiName = null;

x.init = function(appInstance){
    app = appInstance;
    return this;
};

x.setApiName = function(name){
    apiName = name;
    return this;
};

x.data = {};

x.onLoad = function(option)
{
    this.setData(option);
    this.setPage(1);
    wx.startPullDownRefresh();
};

x.setPage = function(page)
{
    this.setData({page: page});
};

x.loadData = function()
{
    function success(response)
    {
        var dataTemp = response.data.data;
        var list = [];
        if(that.data.page > 1){
            list = that.data.list.concat(dataTemp.list);
        }
        else{
            list = dataTemp.list;
        }
        var data = {
            list: list,
            next: dataTemp.next,
            count: dataTemp.count
        };
        that.setData(data);
        wx.stopPullDownRefresh();
    }
    
    var that = this;
    var data = {
        token: app.dry.getToken(),
        device: app.config.device,
        page: this.data.page
    };
    app.r().setData(data).setSuccess(app.msg.ifFailStop).setSuccess(success).setLoadingText("正在加載數據").run(apiName);
};

x.onPullDownRefresh = function()
{
    this.setPage(1);
    this.loadData();
};

x.onReachBottom = function()
{
    if(this.data.next){
        this.setPage(this.data.page + 1);
        this.loadData();
    }
};

module.exports = x;
相關文章
相關標籤/搜索