完整功能分頁
<el-pagination
@size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[100, 200, 300, 400]" :page-size="100" layout="total, sizes, prev, pager, next, jumper" :total="400"> </el-pagination>
pagination 屬性：
| 參數 | 類型 | 說明 | 可選值 | 默認值 |
|---|---|---|---|---|
| small | 是否使用小型分頁樣式 | Boolean | — | false |
| background | 是否為分頁按鈕添加背景色 | Boolean | — | false |
| page-size | 每頁顯示條目個數 | Number | — | 10 |
| total | 總條目數 | Number | — | — |
| page-count | 總頁數，total 和 page-count 設置任意一個就可以達到顯示頁碼的功能；如果要支持 page-sizes 的更改，則需要使用 total 屬性 | Number | — | — |
| current-page | 當前頁數，支持 .sync 修飾符 | Number | — | 1 |
| layout | 組件布局，子組件名用逗號分隔 | String | sizes, prev, pager, next, jumper, ->, total, slot | ‘prev, pager, next, jumper, ->, total’ |
| page-sizes | 每頁顯示個數選擇器的選項設置 | Number[] | — | [10, 20, 30, 40, 50, 100] |
| popper-class | 每頁顯示個數選擇器的下拉框類名 | string | — | — |
| prev-text | 替代圖標顯示的上一頁文字 | string | — | — |
| next-text | 替代圖標顯示的下一頁文字 | string | — | — |
pagination 事件
| 事件名稱 | 說明 | 回調參數 |
|---|---|---|
| size-change | pageSize 改變時會觸發 | 每頁條數size |
| current-change | currentPage 改變時會觸發 | 當前頁currentPage |
pagination slot
| name | 說明 |
|---|---|
| — | 自定義內容，需要在 layout 中列出 slot |