|
@@ -1,13 +1,13 @@
|
|
<!-- 基于 ruoyi-vue3 的 Pagination 重构,核心是简化无用的属性,并使用 ts 重写 -->
|
|
<!-- 基于 ruoyi-vue3 的 Pagination 重构,核心是简化无用的属性,并使用 ts 重写 -->
|
|
<template>
|
|
<template>
|
|
<el-pagination
|
|
<el-pagination
|
|
- v-show="total > 0"
|
|
|
|
|
|
+ v-show="+total > 0"
|
|
v-model:current-page="currentPage"
|
|
v-model:current-page="currentPage"
|
|
v-model:page-size="pageSize"
|
|
v-model:page-size="pageSize"
|
|
:background="true"
|
|
:background="true"
|
|
:page-sizes="[10, 20, 30, 50, 100]"
|
|
:page-sizes="[10, 20, 30, 50, 100]"
|
|
:pager-count="pagerCount"
|
|
:pager-count="pagerCount"
|
|
- :total="total"
|
|
|
|
|
|
+ :total="+total"
|
|
:small="isSmall"
|
|
:small="isSmall"
|
|
class="float-right mb-15px mt-15px"
|
|
class="float-right mb-15px mt-15px"
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
@@ -33,7 +33,7 @@ const props = defineProps({
|
|
// 总条目数
|
|
// 总条目数
|
|
total: {
|
|
total: {
|
|
required: true,
|
|
required: true,
|
|
- type: Number
|
|
|
|
|
|
+ type: [Number, String]
|
|
},
|
|
},
|
|
// 当前页数:pageNo
|
|
// 当前页数:pageNo
|
|
page: {
|
|
page: {
|
|
@@ -74,7 +74,7 @@ const pageSize = computed({
|
|
})
|
|
})
|
|
const handleSizeChange = (val) => {
|
|
const handleSizeChange = (val) => {
|
|
// 如果修改后超过最大页面,强制跳转到第 1 页
|
|
// 如果修改后超过最大页面,强制跳转到第 1 页
|
|
- if (currentPage.value * val > props.total) {
|
|
|
|
|
|
+ if (currentPage.value * val > +props.total) {
|
|
currentPage.value = 1
|
|
currentPage.value = 1
|
|
}
|
|
}
|
|
// 触发 pagination 事件,重新加载列表
|
|
// 触发 pagination 事件,重新加载列表
|