Skip to content

Commit 39d8bef

Browse files
authored
fix(Table): fix controlled current page is covered by default change when innerCurrent is larger than page count (#6127)
* fix(Pagination): improve page size change handling and ensure current page consistency+ * fix(Pagination): ensure controlled current value updates and emit currentChange event * fix(Pagination): enhance page size handling and improve current page navigation logic * fix(Pagination): remove redundant onChange event emission in page change handler
1 parent 02b54ad commit 39d8bef

File tree

2 files changed

+43
-28
lines changed

2 files changed

+43
-28
lines changed

packages/components/pagination/pagination.tsx

Lines changed: 37 additions & 28 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,
@@ -182,38 +182,47 @@ export default defineComponent({
182182
pageChangeMap[type]();
183183
};
184184

185-
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-
}
185+
const onSelectorChange = (val: string | number) => {
186+
if (props.disabled) return;
194187

195-
let isIndexChange = false;
188+
const pageSize = Number(val);
189+
const newPageCount = pageSize > 0 ? Math.max(Math.ceil(props.total / pageSize), 1) : 1;
190+
const indexExceeds = innerCurrent.value > newPageCount;
191+
// 用户自主控制
192+
const userControlled = current.value != null && current.value < newPageCount;
196193

197-
if (innerCurrent.value > pageCount) {
198-
isIndexChange = true;
199-
}
200-
201-
/**
202-
* 分页大小变化事件
203-
* @param {Number} pageSize 分页大小
204-
* @param {Number} index 当前页
205-
*/
206-
const pageInfo = {
207-
current: isIndexChange ? pageCount : innerCurrent.value,
194+
// 初始 pageInfo(用于 setInnerPageSize 时传参)
195+
const initialPageInfo = {
196+
current: indexExceeds ? newPageCount : innerCurrent.value,
208197
previous: innerCurrent.value,
209198
pageSize,
210199
};
211-
setInnerPageSize(pageSize, pageInfo);
212-
if (isIndexChange) {
213-
toPage(pageCount, pageInfo);
214-
} else {
215-
props.onChange?.(pageInfo);
216-
}
200+
201+
setInnerPageSize(pageSize, initialPageInfo);
202+
203+
nextTick(() => {
204+
if (indexExceeds) {
205+
// 当当前页索引超过新页数时,需要跳转到合适页
206+
const pageCurrent = userControlled ? newPageCount : innerCurrent.value;
207+
const pageInfo = {
208+
current: pageCurrent,
209+
previous: initialPageInfo.current,
210+
pageSize,
211+
};
212+
toPage(pageCurrent, pageInfo);
213+
} else {
214+
const pageInfo = {
215+
current: innerCurrent.value,
216+
previous: initialPageInfo.current,
217+
pageSize,
218+
};
219+
// 如果在 setInnerPageSize 后 current 被外部受控修改,则触发 currentChange 事件
220+
if (innerCurrent.value !== pageInfo.previous) {
221+
emit('currentChange', innerCurrent.value, pageInfo);
222+
}
223+
props.onChange?.(pageInfo);
224+
}
225+
});
217226
};
218227

219228
const onJumperChange = (val: number) => {
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
pr_number: 6127
3+
contributor: RSS1102
4+
---
5+
6+
- fix(Table): 修改在 pageSize 改变时无法自定义当前页的问题 @RSS1102 ([#6127](https://github.com/Tencent/tdesign-vue-next/pull/6127))

0 commit comments

Comments
 (0)