Skip to content

Commit bae1223

Browse files
committed
fix(Pagination): improve page size change handling and current page validation
1 parent b546c09 commit bae1223

File tree

1 file changed

+29
-20
lines changed

1 file changed

+29
-20
lines changed

packages/components/pagination/pagination.tsx

Lines changed: 29 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { defineComponent, computed, ref, watch, toRefs, getCurrentInstance } from 'vue';
1+
import { defineComponent, computed, ref, watch, toRefs, getCurrentInstance, nextTick } from 'vue';
22
import { isNaN, isObject } from 'lodash-es';
33
import {
44
PageFirstIcon as TdPageFirstIcon,
@@ -183,37 +183,46 @@ export default defineComponent({
183183
};
184184

185185
const onSelectorChange: (e: string) => void = (e) => {
186-
if (props.disabled) {
187-
return;
188-
}
189-
const pageSize: number = parseInt(e, 10);
190-
let pageCount = 1;
191-
if (pageSize > 0) {
192-
pageCount = Math.max(Math.ceil(props.total / pageSize), 1);
193-
}
186+
if (props.disabled) return;
194187

195-
let isIndexChange = false;
188+
const pageSize: number = parseInt(e, 10);
189+
const newPageCount = pageSize > 0 ? Math.max(Math.ceil(props.total / pageSize), 1) : 1;
196190

197-
if (innerCurrent.value > pageCount) {
198-
isIndexChange = true;
199-
}
191+
// 当前页在变更 pageSize 之后是否会超出新的页码范围
192+
const prevCurrent = innerCurrent.value;
200193

201194
/**
202195
* 分页大小变化事件
203196
* @param {Number} pageSize 分页大小
204197
* @param {Number} index 当前页
205198
*/
206199
const pageInfo = {
207-
current: isIndexChange ? pageCount : innerCurrent.value,
208-
previous: innerCurrent.value,
200+
current: prevCurrent,
201+
previous: prevCurrent,
209202
pageSize,
210203
};
204+
211205
setInnerPageSize(pageSize, pageInfo);
212-
if (isIndexChange) {
213-
toPage(pageCount, pageInfo);
214-
} else {
215-
props.onChange?.(pageInfo);
216-
}
206+
207+
nextTick(() => {
208+
// 使用外部受控的 props.current,如果没有则使用 prevCurrent
209+
const finalCurrent = props.current ?? prevCurrent;
210+
const willExceed = finalCurrent > newPageCount;
211+
const finalPageInfo = {
212+
...pageInfo,
213+
current: finalCurrent,
214+
};
215+
216+
if (willExceed) {
217+
// 当前页超出新页码范围时,跳转到最后一页
218+
toPage(newPageCount, finalPageInfo);
219+
} else if (finalCurrent !== prevCurrent) {
220+
toPage(finalCurrent, finalPageInfo);
221+
} else {
222+
// 正常触发 onChange
223+
props.onChange?.(finalPageInfo);
224+
}
225+
});
217226
};
218227

219228
const onJumperChange = (val: number) => {

0 commit comments

Comments
 (0)