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
- 价格高-Akkocloud:月付 120 元 1G 内存 德国原全球[VPS测评]
- 促销优惠 极光 KVM→4 月新增日本东京 CN2 产品 美国洛杉矶双向日本VPS[主机]
- 做站推荐 阿里云→万网虚拟主机 35 折促销 带宽全面升级 最高 20M全球[VPS测评]
- VPS 推荐 搬瓦工→DC9 强势回归 1Gbps 洛杉矶 CN2 G全球[VPS测评]
- 黑五 RAKsmart→“黑色星期五”购物狂欢节 I3 低至$46 抢购全球[VPS测评]
- 虎字下面的几变成一个口中间有个羊字是什么成语?全球[VPS测评]
- 八月优惠 RAKsmart→美国 CN 直连服务器降至 399 元 月 美国VPS[主机]
- DogYun→圣何塞 CN2 GIA 线路经典云月付 15.6 元起 动全球[VPS测评]
- 新商家慎重-QSVM→10 元 月 50Mbps 宽带 500G 流量 全球[VPS测评]
- Directory Listing Denied全球[VPS测评]
- HostKvm 七月优惠→香港国际 美国防御 VPS 限量七折优惠美国VPS[主机]
- [双十二]HostXen 充 300 送 50 续费减 10 元 买 2全球[VPS测评]
- Netim→.eu 域名优惠 10 年付仅需 12 欧 限欧洲全球[VPS测评]
- racknerd→网站改版 3 款便宜 VPS 促销 $16 年 KVM全球[VPS测评]
- CombCloud 母亲节促销 7.5 折优惠,香港沙田 大浦 CN2,香港VPS[主机]
- 建站云服务器选择高效云盘还是SSD硬盘?全球[VPS测评]
- Ucloud云服务器官方补贴 个人新用户北上广低至¥77/年;香港低至¥香港VPS[主机]
- HKServerSolution 美西经济型 99元月付 GIA全球[VPS测评]
- Olvps → 256M内存 5G 储存 512G流量 30Mbps 全球[VPS测评]
- Fatal error: Allowed memory size of 全球[VPS测评]
- 亿速云11.11上云狂欢节活动:2核4G国内/香港云服务器,价格999元香港VPS[主机]
- tudcloud:香港vps/2核/2GB/20GB空间/不限流量/KV虚拟空间(主机)
- 葫芦云:香港CN2/洛杉矶GIA高防vps,24元/月;1核/1GB/2虚拟空间(主机)
- 外贸无界烟台市有多少跨境电商?烟台跨境电商开发平台,烟台跨境电商选品全球[VPS测评]
- 2022年最新的15个美容院抖音文案,美容院文案怎么写全球[VPS测评]
- UCloud优刻得云服务器建站教程:香港云服务器购买优惠方法香港VPS[主机]
- 瓜云互联怎么样?香港/美国洛杉矶CN2高防vps 50G月付34元美国VPS[主机]
- 数据中心助力光纤光缆行业发展全球[VPS测评]
- 后浪云:优惠码”2021″,美国/香港2核4G2M云服务器仅32.5元/美国VPS[主机]
- wikihost微基主机服务,香港稳定虚拟主机8折,3.73元/月起,C香港VPS[主机]
转载请注明原文地址:http://140.238.13.167:12355/read-208381.html











