1:vue项目使用的是iview组件库,引入方法在这里就不介绍了
2: 这是iview Page的官方文档 https://www.iviewui.com/components/page
3:具体使用的方法及参数
<Page
:total="tableTotal"
:current="pageIndex"
:page-size="pageSize"
show-total
show-sizer
@on-change="tablePageChange"
@on-page-size-change="tablePageSizeChange"
></Page>
//current 表示是当前页码
//page-size 每页条数
//show-total 显示总数 默认的是false不显示
//show-sizer 显示分页 默认的是false 不显示
// @on-change 页码改变的回调,返回改变后的页码
// @on-page-size-change 切换每页条数时的回调,返回切换后的每页条数
//以下是初始化时的一些值
tableTotal: 0, //数据总数
pageIndex: 1, //当前页码
pageSize: 10, //每页条数
4:当获取到接口数据时按照后台返回的参数代入即可
if (res.data.state == 1) {
let rowData = res.data.data;
this.tableData = rowData;
this.tableTotal = this.tableData.length;
this.tableTotal = res.data.total;
5:页面的样式

本文详细介绍了在Vue项目中如何使用iView组件库的分页组件Page,包括基本用法、参数设置及回调函数的使用,同时提供了初始化值的设置和接口数据处理的示例。
1万+

被折叠的 条评论
为什么被折叠?



