bootstrapTable後端分頁

bootstrapTable由於後端分頁文檔並不夠詳細，自己折騰老好一會才做出實例出來，現記錄下來。

略過簡單部分，只說在配置項裏面的必須部分。

$("#queryTab").bootstrapTable("destroy").bootstrapTable({
        height: TABLE_HEIGHT,
        method: 'POST',
        search: true,//是否設置搜索框
        pagination: true,//是否設置分頁
        sidePagination: 'server',//服務端分頁的條件
        pageSize: 20,//每頁條數
        pageNumber: 1,//當前頁
        pageList: 'ALL',//如果設置了分頁，選擇頁面的數據條數[5, 10, 15, 20],ALL爲顯示全部
        // paginationLoop: false,//是否設置翻頁循環,默認循環
        contentType: "application/json; charset=UTF-8",
        dataType: "json",
        url: info.url,
        /**傳遞給後臺的查詢信息
         * bootstrapTable默認行爲會把查詢參數轉爲表單數據，故需要stringify()轉換一次
         * @param params 效果等同於this
         * @returns {*} 查詢參數，包含當前頁和查詢關鍵字
         */
        queryParams: function (params) {
            return JSON.stringify({
                //計算當前頁（offset：如第21到40條，20即爲offset，limit爲每頁數據條數）
                pageNum: (params.offset / params.limit) + 1,
                product_name: info.data.product_name
            });
        },
        /**查詢後返回的數據在加載前的處理
         *
         * @param result 查詢後服務器返回的結果
         * @returns {{total: int, rows: Array}} 返回數據爲包含total和rows的2個屬性
         */
        responseHandler: function (result) {
            if (result.head && result.head.actionCode) {
                var data = result.body;
                return {
                    total: data.allPages * this.pageSize,   //總共的條目數量
                    rows: data.processArray //當前頁需要顯示的數據
                };
            } else {
                return {
                    total: 0,
                    rows: []
                }
            }
        },
        onLoadSuccess: function () {

        },
        onLoadError: function () {
            console.log('error')
        },
        formatShowingRows: function (pageFrom, pageTo, totalRows) {
            return '第 ' + pageFrom + ' 條到 ' + pageTo + '條 ，共 ' + totalRows + ' 條'
        },
        columns: columns

    });

queryParams爲傳遞給後臺的查詢參數，官方的說明文檔有誤，實測不需「pageSize, pageNumber, searchText, sortName, sortOrder」或「limit, offset, search, sort, order」等參數的傳遞；

responseHandler爲得到服務端傳遞的數據，之後要給boostrapTable進行數據加載，要包含2個屬性total，rows，實際使用參見以上實例