elementUI分页el-pagination组件事件current-change和size-change

elementUI分页el-pagination组件有两个重要的事件current-change和size-change

官方文档标识

事件名称	说明	回调参数
size-change	pageSize 改变时会触发	每页条数
current-change	currentPage 改变时会触发	当前页

 

一、实际测试，仅用户界面使用组件时，才触发current-change事件，js直接修改页码绑定值不触发事件，例子如下1.2.

1.进行页面操作el-pagination组件时，使用组件提供的功能，会触发current-change事件(包括点击非当前页码，点击上下步骤，前往x页等操作)

2.而直接js修改current-page绑定值时候，页码值显示会对应改变（响应式），但是current-change事件不触发

例：

　　1.当前页码current-page为1，触发current-change事件时，current-change绑定的回调函数会改变el-table的数据，

　　2.直接增加一个button，click触发点击事件修改current-page为2，组件显示current-page为2，但是current-change事件不触发，el-table不会变化。如果要使el-table变化，则需要在button点击事件修改页码后，编写修改el-table的代码

 

二、size-change同理，仅用户操作才出发，js操作不触发

 

三、pageSize和currentPage要实现双向绑定，可以使用 .sync 修饰符，或者在对应size-change和current-change事件将回调参数赋值给对应的pageSize和currentPage绑定值。