![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/203c514a6bc3a2ef6c64bcffc6cddcd2.png)
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[100, 200, 300, 400]"
:page-size="100"
:hide-on-single-page="true"
layout="total, sizes, prev, pager, next, jumper"
:total="400">
</el-pagination>
事件名称及属性 | 说明 |
---|
size-change | pageSize 改变时会触发 |
current-change | currentPage 改变时会触发 |
current-page | 当前页数 |
page-size | 每页显示条目个数 |
total | 总条目数 |
hide-on-single-page | 只有一页时是否隐藏 |
methods: {
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
},
handleSearch() {
api...
this.currentPage = 1
}
},