bootstrapTable 数据格式

最新推荐文章于 2025-06-11 02:52:33 发布

沙赞

最新推荐文章于 2025-06-11 02:52:33 发布

阅读量1w

点赞数 4

CC 4.0 BY-SA版权

分类专栏： js插件文章标签： bootstrapTable dataFommat

本文链接：https://blog.youkuaiyun.com/weixin_42776979/article/details/82966182

js插件专栏收录该内容

6 篇文章

订阅专栏

本文详细解析了Bootstrap Table中客户端和服务器数据格式的要求，包括基本的数组格式、自定义响应格式及分页参数的设置。介绍了如何使用responseHandler自定义数据格式，以及如何通过queryParams方法传递分页参数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、客户端数据格式

（1）

[{id:"1",name:"a"},{id:"2",name:"b"}]

这是最基础的格式

（2）

 else if (!$.isArray(data)) { // support fixedScroll
            fixedScroll = data.fixedScroll;
            data = data.data;
        }

从源码可以看出来如果不是从服务器取数据数据不是数组可以是如下格式

{data:[{id:"1",name:"a"},{id:"2",name:"b"}]}

2、服务器数据格式

默认是 {total:0,rows:[]}

  if (this.options.pagination && this.options.sidePagination === 'server') {
            this.options.totalRows = data[this.options.totalField];
            fixedScroll = data.fixedScroll;
            data = data[this.options.dataField];
        }

totalField="total"

dataField="rows"

有以上两个默认的属性。可以自定义，所以数据格式的key也是可以自定义的。

从源码可以看出需要 pagination=true 并且 sidePagination ="server" 同时成立才是这个服务器数据格式。

3、另外，也可以使用 responseHandler 来格式化数据格式

responseHandler: function (res) {
            return res;
        }

通过option里的这个方法可以将自己的数据格式转换成bootstrapTable支持的格式。

4、往后台传的分页参数

（1）默认分页参数

pageNumber  pageSize   pageList

（2）通过方法修改分页参数

queryParams: function (params) {
            return params;
        },

该方法也可以传其他参数

以上代码部门均为源码。

http://issues.wenzhixin.net.cn/bootstrap-table/assets/bootstrap-table/src/bootstrap-table.js