分页组件
分页组件是在前端对数据集进行分页获取数据。
页面中的表格、列表等数据展示组件,可配合使用分页组件来展示下一页的数据。
请求参数
打开浏览器的 F12,查看网络请求链接,当点击分页组件的分页时,会发起一个新的网络请求,其中请求参数包括以下:
- limit:每页的数据条数,这里测试每页请求 1 条。数据集如果不设置分页数据大小,每页默认是 20 条。
- offset:请求数据的偏移量,第 1 页从 0 开始。比如 limit = 1,那么第 2 页是 offset = (页码 - 1) limit = (2-1)1 = 1。
点击第 1 页的请求参数:
点击第 2 页的请求参数:
组件使用
一般页面中如果放置了表格、列表之类的数据展示组件,可以在这些组件下边,把分页组件再放入进来,如图所示:
放置后,会提示需要绑定一下数据集,如果此时不做设置,可以后续在组件的右侧属性中再进行绑定。
绑定的数据集就是需要进行分页显示的数据,一般和表格绑定的数据集保持一致。
常用配置
每页条数配置
数据集默认配置
选择数据集后,点击右侧的“编辑”按钮,在弹出配置中,手动设置“分页数据大小”,这里测试选择每页 1 条。
如果不设置,默认为每页 20 条。如果要一页返回全部数据,可以在输入框右侧的 ... 中设置为 -1。
这里设置后,默认数据集请求的时候就会按照该条数返回数据。切换不同的页码时,也是按照此条数进行返回。
分页指定每页条数
除了在数据集上进行配置每页条数,也可以在分页组件中进行配置。
分页组件默认已经设置了“指定每页条数”,但默认没有显示出来,还需要额外设置“显示切换器”为是。
配置后,显示效果如图所示:
在分页组件上切换不同的条数,会覆盖之前数据集默认设置的条数,以分页设置的为先。
一页时隐藏分页
如果数据量较少,只有一页数据,可以配置“一页时隐藏分页”为是。
配置后,整个分页组件都不会显示出来:
显示总记录数
默认没有显示总数据量,可以在右侧的“显示总记录数”选择其中一个样式进行设置。
配置后,显示效果如图所示: