一、约定

标题	内容
路由地址	无（组件）
路由页面	src\components\Pagination\index.vue
操作权限	无限制
API调用约定	当前组件不进行API调用，仅做展现层控制。

二、属性（Attributes）

组件props传入参数

序号	参数名	类型	必填	说明	默认值
1	page	Object	否	分页信息	{pageSize: 10, pageNo: 1}
2	total	Number	否	总数据条数	0

内部data参数

无内部独立数据参数，组件使用props传入的数据进行展示和操作。

三、组件管理

（一）组件事件

组件自身提供的功能

核心功能点，执行的事件关系：

分页展示

页码切换

每页条数切换

分页变化事件上报

（二）子组件

使用子组件提供功能

分页展示与交互

1. el-pagination组件

提供分页基础功能

父→子组件传参

v-model:current-page: 当前页码

v-model:page-size: 每页条数

page-sizes: 可选的每页条数选项

layout: 分页组件布局

total: 总数据条数

background: 是否显示背景色

子→父事件上报

上报通知	用途	执行内部事件
size-change	每页条数变化	handleSizeChange
current-change	当前页码变化	handleCurrentChange

四、事件方法

核心事件，含数据处理、事件管理等

1. handleSizeChange(val) 每页条数变化处理

接收新的每页条数值

触发changePageEmit事件通知父组件分页信息变化

2. handleCurrentChange(val) 当前页码变化处理

接收新的页码值

触发changePageEmit事件通知父组件分页信息变化

Pagination 分页组件二次封装

一、约定#

二、属性（Attributes）#

三、组件管理#

（一）组件事件#

（二）子组件#

1. el-pagination组件#

四、事件方法#

1. handleSizeChange(val) 每页条数变化处理#

2. handleCurrentChange(val) 当前页码变化处理#

一、约定

二、属性（Attributes）

三、组件管理

（一）组件事件

（二）子组件

1. el-pagination组件

四、事件方法

1. handleSizeChange(val) 每页条数变化处理

2. handleCurrentChange(val) 当前页码变化处理