fix: fix IconPicker reporting an error when using search if no icon is found (#6944)

* 修复未搜索图标时分页报错的问题
 * 优化`IconPicker` 的分页逻辑,由total触发跳转到第一页,而不是用户控制
This commit is contained in:
ming4762
2025-11-24 07:56:55 +08:00
committed by GitHub
parent b17fec41b0
commit a810cd0b48
2 changed files with 21 additions and 15 deletions

View File

@@ -71,17 +71,10 @@ const modelValue = defineModel({ default: '', type: String });
const visible = ref(false);
const currentSelect = ref('');
const currentPage = ref(1);
const keyword = ref('');
const keywordDebounce = refDebounced(keyword, 300);
const innerIcons = ref<string[]>([]);
/* 当检索关键词变化时,重置分页 */
watch(keywordDebounce, () => {
currentPage.value = 1;
setCurrentPage(1);
});
watchDebounced(
() => props.prefix,
async (prefix) => {
@@ -122,7 +115,7 @@ const showList = computed(() => {
);
});
const { paginationList, total, setCurrentPage } = usePagination(
const { paginationList, total, setCurrentPage, currentPage } = usePagination(
showList,
props.pageSize,
);
@@ -145,7 +138,6 @@ const handleClick = (icon: string) => {
};
const handlePageChange = (page: number) => {
currentPage.value = page;
setCurrentPage(page);
};

View File

@@ -1,6 +1,6 @@
import type { Ref } from 'vue';
import { computed, ref, unref } from 'vue';
import { computed, ref, unref, watch } from 'vue';
/**
* Paginates an array of items
@@ -22,7 +22,11 @@ function pagination<T = any>(list: T[], pageNo: number, pageSize: number): T[] {
return ret;
}
export function usePagination<T = any>(list: Ref<T[]>, pageSize: number) {
export function usePagination<T = any>(
list: Ref<T[]>,
pageSize: number,
totalChangeToFirstPage = true,
) {
const currentPage = ref(1);
const pageSizeRef = ref(pageSize);
@@ -38,11 +42,21 @@ export function usePagination<T = any>(list: Ref<T[]>, pageSize: number) {
return unref(list).length;
});
if (totalChangeToFirstPage) {
watch(total, () => {
setCurrentPage(1);
});
}
function setCurrentPage(page: number) {
if (page < 1 || page > unref(totalPages)) {
throw new Error('Invalid page number');
if (page === 1 && unref(totalPages) === 0) {
currentPage.value = 1;
} else {
if (page < 1 || page > unref(totalPages)) {
throw new Error('Invalid page number');
}
currentPage.value = page;
}
currentPage.value = page;
}
function setPageSize(pageSize: number) {
@@ -54,5 +68,5 @@ export function usePagination<T = any>(list: Ref<T[]>, pageSize: number) {
currentPage.value = 1;
}
return { setCurrentPage, total, setPageSize, paginationList };
return { setCurrentPage, total, setPageSize, paginationList, currentPage };
}