[Ext JS Grid] 后端数据分页Store Grid

Ext JS 提供了一个分页工具栏组件-pagingtoolbar, 这个可以添加到Grid 中,通过点击上一页/下一页按钮进行数据的分页查询。
如果使用的是ajax 类型的代理的 Store, 数据从后端获取, 则在分页查询时,会额外附加page、start和limit 三个参数,这三个参数的意思是:

  • page ,当前页
  • start , 数据开始的下标
  • limit , 一次取出的数据量
    在后端数据接口中, 根据这三个参数, 返回对应页数的数据。

后端数据分页Grid 定义

数据从后端读取时,添加pagingtoolbar 之后, 分页的工具栏和Store数据就自动绑定了。
这里先基于Spring Boot定义一个后端的数据接口,接收 page、start和limit 三个参数,代码类似:

	@GetMapping(value="/users" ,produces="application/json")
	@CrossOrigin(origins = "*")
	public Map<String, Object> listUser(@RequestParam(required = false) int page,
			@RequestParam(required = false) int start, @RequestParam(required = false) int limit) {

接口呼叫地址 http://localhost:8080/grid/users?page=1&start=0&limit

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

oscar999

送以玫瑰,手留余香

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值