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
- 疯狂猜成语 图猜成语一个人在搬一块很大的石头是什么成语?全球[VPS测评]
- hosteons→免费提供 Windows 授权 8 折优惠 $36 年WINDOWS
- TMThosting→西雅图高防 KVM 八折起 月付 3.16 美元起全球[VPS测评]
- Hostodo 便宜美国 NVMe 硬盘 VPS,高 IO 读写,1G 美国VPS[主机]
- 上新LOCVPS→新上香港黄埔 VPS XEN BGP 线路轮询 终身七WINDOWS
- TenVM→28.8 元 月 512MB 内存 10GB SSD 空间 虚拟空间(主机)
- STSDUST→$25 月 2 核 2GB 内存 20GB 空间 10T虚拟空间(主机)
- 桔子数据→28 元 月 1GB 内存 40GB SSD 空间 500GB虚拟空间(主机)
- LOCVPS 新上香港云地 KVM 全场 8 折 2G 内存套餐月付 4香港VPS[主机]
- 促销 $25 年 2CPU 2G 内存 20G SSD 2.5T 流量 全球[VPS测评]
- 促销 hostsailor→全场 5 折优惠 VPS 低至$0.99 月全球[VPS测评]
- IMIDC→$4 月 KVM-512MB 20GB 500GB 香港&台日本VPS[主机]
- 如何快速创建个人独立博客并从中获益?独立服务器[U]
- 忘记WordPress后台密码要如何找回或修改密码全球[VPS测评]
- 阳帝云 1核1G10M大宽带香港BGP月付14元香港VPS[主机]
- 微基主机 洛杉矶Cera高防VPS 1G内存/30G硬盘/CN2GIA/全球[VPS测评]
- Netcetera 英国便宜Linux VPS和Windows VPS首WINDOWS
- LH.pl → 37€ 月 波兰 1C4G50G硬盘 不限流量 免费备份全球[VPS测评]
- HKServerSolution → 4G内存 20G SSD 3T流量全球[VPS测评]
- 什么是IconFont ?iconfont 的使用和解析全球[VPS测评]
- 百看不厌的文案,抖音唯美文案。全球[VPS测评]
- 牛信云入选艾瑞《2022年中国跨境电商服务行业趋势报告》典型厂商全球[VPS测评]
- 兼容移动和PC的loading加载和toast消息插件全球[VPS测评]
- 港口雄开万里流丨不出国门海淘全球青岛跨境电商未来可期全球[VPS测评]
- 2022年亚马逊Prime会员日将于7月12日和13日举行,覆盖24个站全球[VPS测评]
- 江苏高防服务器哪里买?宿迁BGP、宿迁双线高防服务器的价格全球[VPS测评]
- 华凯易佰同比扭亏跨境电商行业回暖H2旺季将至中报追踪全球[VPS测评]
- 葫芦云:香港CN2/洛杉矶GIA高防vps,24元/月;1核/1GB/2虚拟空间(主机)
- 30个美容院抖音唯美文案,看到就直接拿去发吧全球[VPS测评]
- UCloud优刻得云服务器建站教程:香港云服务器购买优惠方法香港VPS[主机]
转载请注明原文地址:http://140.238.13.167:12355/read-220309.html











