mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
feat(Pagination): some props can be string
This commit is contained in:
parent
2546ca58b8
commit
3aac04ce42
@ -60,12 +60,12 @@ export default {
|
|||||||
|------|------|------|------|
|
|------|------|------|------|
|
||||||
| v-model | Current page number | *number* | - |
|
| v-model | Current page number | *number* | - |
|
||||||
| mode | Mode, can be set to `simple` `multi` | *string* | `multi` |
|
| mode | Mode, can be set to `simple` `multi` | *string* | `multi` |
|
||||||
| total-items | Total items | *number* | `0` |
|
|
||||||
| items-per-page | Item number per page | *number* | `10` |
|
|
||||||
| page-count | The total number of pages, if not set, will be calculated based on `total-items` and `items-per-page` | *number* | `-` |
|
|
||||||
| prev-text | Previous text | *string* | `Previous` |
|
| prev-text | Previous text | *string* | `Previous` |
|
||||||
| next-text | Next text | *string* | `Next` |
|
| next-text | Next text | *string* | `Next` |
|
||||||
| show-page-size | Count of page size to show | *number* | `5` |
|
| total-items | Total items | *number \| string* | `0` |
|
||||||
|
| items-per-page | Item number per page | *number \| string* | `10` |
|
||||||
|
| page-count | The total number of pages, if not set, will be calculated based on `total-items` and `items-per-page` | *number \| string* | `-` |
|
||||||
|
| show-page-size | Count of page size to show | *number \| string* | `5` |
|
||||||
| force-ellipses | Whether to show ellipses | *boolean* | `false` |
|
| force-ellipses | Whether to show ellipses | *boolean* | `false` |
|
||||||
|
|
||||||
### Events
|
### Events
|
||||||
|
@ -60,14 +60,14 @@ export default {
|
|||||||
| 参数 | 说明 | 类型 | 默认值 |
|
| 参数 | 说明 | 类型 | 默认值 |
|
||||||
|------|------|------|------|
|
|------|------|------|------|
|
||||||
| v-model | 当前页码 | *number* | - |
|
| v-model | 当前页码 | *number* | - |
|
||||||
| mode | 显示模式,可选值为 `simple` `multi` | *string* | `multi` |
|
| mode | 显示模式,可选值为 `simple` | *string* | `multi` |
|
||||||
| total-items | 总记录数 | *number* | `0` |
|
| prev-text | 上一页按钮文字 | *string* | `上一页` |
|
||||||
| items-per-page | 每页记录数 | *number* | `10` |
|
| next-text | 下一页按钮文字 | *string* | `下一页` |
|
||||||
| page-count | 总页数 | *number* | `根据页数计算` |
|
| page-count | 总页数 | *number \| string* | 根据页数计算 |
|
||||||
| prev-text | 上一页 | *string* | `上一页` |
|
| total-items | 总记录数 | *number \| string* | `0` |
|
||||||
| next-text | 下一页 | *string* | `下一页` |
|
| items-per-page | 每页记录数 | *number \| string* | `10` |
|
||||||
| show-page-size | 显示的页码个数 | *number* | `5` |
|
| show-page-size | 显示的页码个数 | *number \| string* | `5` |
|
||||||
| force-ellipses | 显示省略号 | *boolean* | `false` |
|
| force-ellipses | 是否显示省略号 | *boolean* | `false` |
|
||||||
|
|
||||||
### Events
|
### Events
|
||||||
|
|
||||||
|
@ -12,28 +12,28 @@ export default createComponent({
|
|||||||
prevText: String,
|
prevText: String,
|
||||||
nextText: String,
|
nextText: String,
|
||||||
forceEllipses: Boolean,
|
forceEllipses: Boolean,
|
||||||
|
mode: {
|
||||||
|
type: String,
|
||||||
|
default: 'multi',
|
||||||
|
},
|
||||||
value: {
|
value: {
|
||||||
type: Number,
|
type: Number,
|
||||||
default: 0,
|
default: 0,
|
||||||
},
|
},
|
||||||
pageCount: {
|
pageCount: {
|
||||||
type: Number,
|
type: [Number, String],
|
||||||
default: 0,
|
default: 0,
|
||||||
},
|
},
|
||||||
totalItems: {
|
totalItems: {
|
||||||
type: Number,
|
type: [Number, String],
|
||||||
default: 0,
|
default: 0,
|
||||||
},
|
},
|
||||||
mode: {
|
|
||||||
type: String,
|
|
||||||
default: 'multi',
|
|
||||||
},
|
|
||||||
itemsPerPage: {
|
itemsPerPage: {
|
||||||
type: Number,
|
type: [Number, String],
|
||||||
default: 10,
|
default: 10,
|
||||||
},
|
},
|
||||||
showPageSize: {
|
showPageSize: {
|
||||||
type: Number,
|
type: [Number, String],
|
||||||
default: 5,
|
default: 5,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
@ -48,6 +48,7 @@ export default createComponent({
|
|||||||
pages() {
|
pages() {
|
||||||
const pages = [];
|
const pages = [];
|
||||||
const pageCount = this.count;
|
const pageCount = this.count;
|
||||||
|
const showPageSize = +this.showPageSize;
|
||||||
|
|
||||||
if (this.mode !== 'multi') {
|
if (this.mode !== 'multi') {
|
||||||
return pages;
|
return pages;
|
||||||
@ -56,19 +57,18 @@ export default createComponent({
|
|||||||
// Default page limits
|
// Default page limits
|
||||||
let startPage = 1;
|
let startPage = 1;
|
||||||
let endPage = pageCount;
|
let endPage = pageCount;
|
||||||
const isMaxSized =
|
const isMaxSized = showPageSize < pageCount;
|
||||||
this.showPageSize !== undefined && this.showPageSize < pageCount;
|
|
||||||
|
|
||||||
// recompute if showPageSize
|
// recompute if showPageSize
|
||||||
if (isMaxSized) {
|
if (isMaxSized) {
|
||||||
// Current page is displayed in the middle of the visible ones
|
// Current page is displayed in the middle of the visible ones
|
||||||
startPage = Math.max(this.value - Math.floor(this.showPageSize / 2), 1);
|
startPage = Math.max(this.value - Math.floor(showPageSize / 2), 1);
|
||||||
endPage = startPage + this.showPageSize - 1;
|
endPage = startPage + showPageSize - 1;
|
||||||
|
|
||||||
// Adjust if limit is exceeded
|
// Adjust if limit is exceeded
|
||||||
if (endPage > pageCount) {
|
if (endPage > pageCount) {
|
||||||
endPage = pageCount;
|
endPage = pageCount;
|
||||||
startPage = endPage - this.showPageSize + 1;
|
startPage = endPage - showPageSize + 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -79,7 +79,7 @@ export default createComponent({
|
|||||||
}
|
}
|
||||||
|
|
||||||
// Add links to move between page sets
|
// Add links to move between page sets
|
||||||
if (isMaxSized && this.showPageSize > 0 && this.forceEllipses) {
|
if (isMaxSized && showPageSize > 0 && this.forceEllipses) {
|
||||||
if (startPage > 1) {
|
if (startPage > 1) {
|
||||||
const previousPageSet = makePage(startPage - 1, '...', false);
|
const previousPageSet = makePage(startPage - 1, '...', false);
|
||||||
pages.unshift(previousPageSet);
|
pages.unshift(previousPageSet);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user