diff --git a/src/components/PaginatedRow.tsx b/src/components/PaginatedRow.tsx index 0ccd590..8567663 100644 --- a/src/components/PaginatedRow.tsx +++ b/src/components/PaginatedRow.tsx @@ -32,14 +32,15 @@ export default function PaginatedRow({ } }, [children, startIndex, itemsPerPage]); - // 向前翻页 - 只有不在第一页时才能向前 + // 向前翻页 - 禁止超出第一页 const handlePrevPage = () => { - if (startIndex > 0) { - setStartIndex((prev) => Math.max(0, prev - itemsPerPage)); - } + setStartIndex((prev) => { + const newIndex = prev - itemsPerPage; + return newIndex < 0 ? 0 : newIndex; // 不允许小于0 + }); }; - // 向后翻页 - 支持无限浏览,到达末尾时循环到开头 + // 向后翻页 - 真正的无限浏览 const handleNextPage = () => { setStartIndex((prev) => { const newIndex = prev + itemsPerPage; @@ -50,7 +51,10 @@ export default function PaginatedRow({ // 检查是否可以向前翻页 const canGoPrev = startIndex > 0; - // 检查是否需要显示翻页按钮 + // 总是可以向后翻页(无限循环) + const canGoNext = children.length > itemsPerPage; + + // 如果没有足够的内容需要分页,就不显示按钮 const needsPagination = children.length > itemsPerPage; return ( @@ -84,23 +88,27 @@ export default function PaginatedRow({ )} - {/* 右箭头按钮 - 始终显示 */} - + {/* 右箭头按钮 - 总是显示,支持无限循环 */} + {canGoNext && ( + + )} )} + + {/* 移除页码指示器 - 不再需要 */} ); }