Bootstrap-table 服务端分页无效以及服务端分页后不显示页码的解决方法
![]() | ![]() | ![]() | ![]() |
| 【性价之王】 | 【线路之王】 | 【价格之王】 | 【配置之王】 |
| 【免费之王】 | 【香港首推】 | 【梯子之王】 | 【独服之王】 |

Bootstrap-table 是一款由国人开发的功能非常非常强大的表格插件,强烈推荐各位小伙伴们使用,最近在使用 Bootstrap-table 过程中发现分页方式设置为服务端后无法加载数据以及正确分页了,经过阅读文档发现,Bootstrap-table 客户端分页和服务端分页模式要求返回的数据格式是不一样的。
客户端分页模式只要返回 json 格式的数据数组即可,而服务端分页的时候除了要返回数据数组以外还要返回 total,即总记录数。
客户端分页方式返回数据格式:
[{"id":20170004,"name":"测试活动系部","description":"所属系部活动","begin_time":1501516800,"end_time":1504281600,"create_time":0,"score":0.1,"level":"系级","type_id":"创新创业","department_id":2,"sid":17160100,"aid":20170004,"time":1504751546},{"id":20170002,"name":"学院军训","description":"学院 2017 年军训,大学生志愿者。","begin_time":1504195200,"end_time":1504281600,"create_time":0,"score":0.2,"level":"校级","type_id":"社会实践","department_id":1,"sid":17160100,"aid":20170002,"time":1504676795},{"id":20170001,"name":"学院迎新","description":"学院 2017 年迎新活动,大学生志愿者。","begin_time":1504195200,"end_time":1504281600,"create_time":0,"score":0.5,"level":"校级","type_id":"工作履历","department_id":1,"sid":17160100,"aid":20170001,"time":1504751546}]服务端分页方式返回数据格式:
{"total":4,"rows":[{"id":20170001,"name":"学院迎新","description":"学院 2017 年迎新活动,大学生志愿者。","begin_time":1504195200,"end_time":1504281600,"create_time":0,"score":0.5,"level":"校级","type_id":"工作履历","department_id":1,"sids":"","count":0},{"id":20170002,"name":"学院军训","description":"学院 2017 年军训,大学生志愿者。","begin_time":1504195200,"end_time":1504281600,"create_time":0,"score":0.2,"level":"校级","type_id":"社会实践","department_id":1,"sids":"","count":0},{"id":20170003,"name":"测试活动已过期","description":"已过期活动","begin_time":1504195200,"end_time":1504972800,"create_time":0,"score":0.2,"level":"校级","type_id":"志愿公益","department_id":1,"sids":"","count":0},{"id":20170004,"name":"测试活动系部","description":"所属系部活动","begin_time":1501516800,"end_time":1504281600,"create_time":0,"score":0.1,"level":"系级","type_id":"创新创业","department_id":2,"sids":"","count":0}]}加上 total 后服务端分页模式正常加载了数据,但是却无法正常加载页码,原因是我获 total 的时候是直接使用 count 方法获取了单次查询的结果数组的记录数,而实际上 total 应该是全部符合条件的记录数。改正 total 之后页码显示正常,到此 Bootstrap-table 服务端分页无效以及服务端分页后不显示页码的问题解决。
猜你可能想看的VPS
- Uovz→2000 元 月 2*E5-2450L 16GB 内存 1TB日本VPS[主机]
- wget 下载 https 时报错 ERROR: The certifi全球[VPS测评]
- html select 怎么设置默认选中项全球[VPS测评]
- OLVPS→国庆优惠 新西伯利亚 波特兰 伯力 洛杉矶 CN2 GIA 香港VPS[主机]
- 特价促销 Rainbow cloud→Intel Xeon E3-12X香港VPS[主机]
- 一堆数字 3 一堆数字 5 是什么成语?全球[VPS测评]
- Vultr 支持微信扫码充值 日本 洛杉矶 1 核 512M 内存 1G日本VPS[主机]
- Virmach → $1.5 月付 512M 内存 10G SSD硬盘 全球[VPS测评]
- DMIT 美西CN2 GIA → 1C 1G RAM 10G SSD 5全球[VPS测评]
- 数据中心助力光纤光缆行业发展全球[VPS测评]
- 常见的CN2,GIA,CIA 各个网络线路解释全球[VPS测评]
- “休闲养蜂”风靡海外跨境电商追逐垂直风口全球[VPS测评]
- 人力资源管理系统前端Web模板 - SmartHR全球[VPS测评]
- 为什么大家都选择香港服务器建站香港VPS[主机]
- CombCloud,香港沙田CN2VPS测评,2核1G52元/月,安畅C香港VPS[主机]
- 跨境电商周报丨拼多多布局跨境电商平台;Shopify将推出新平台支持网红全球[VPS测评]
- 为什么要拥有一台VPS?全球[VPS测评]
- 樊云:香港CN2节点vps,最低月付22.5起,带宽5Mbps起步香港VPS[主机]
- JGKVM活动钜惠:美国cn2,香港cmi,大带宽vps,三网直连,10美国VPS[主机]
- Linux chown -R 指令介绍与使用全球[VPS测评]
- 中概股扫描网传拼多多正筹备跨境电商平台首站登陆美国美国VPS[主机]
- CMIVPS,香港vps终身八折$7.76/月起,1核1G内存,香港沙田香港VPS[主机]
- 碳氧云,香港vps路由调整为沙田cn2,特价款6核6G仅80元/月香港VPS[主机]
- SugarHosts,美国云服务器,洛杉矶cn2中美极速专线,香港建站服美国VPS[主机]
- 易科云:香港cn2 vps,洛杉矶 cn2云主机;全场月付9折/季付8折香港VPS[主机]
- 孤狼云:2021春节优惠,香港安畅CN2、香港沙田CN2云服务器低至10香港VPS[主机]
- DMIT:香港CN2 GIA VPS,1核/750M内存/10G硬盘/4香港VPS[主机]
- ExCloud:1核256M存/8GB SSD空间/100GB流量/OV虚拟空间(主机)
- 华纳云新春活动:香港CN2云服务器4核4G5M仅3476元/3年;美国云美国VPS[主机]
- CMIVPS,香港沙田大带宽vps特惠7折,CN2+BGP直连,100M香港VPS[主机]
转载请注明原文地址:http://140.238.13.167:12355/read-217297.html











