我制作了用于分页的组件,但是在两种情况下,工作的逻辑是错误的,但是我看不到哪里。
在React上必要分页的示例:https://tech.skbkontur.ru/react-ui/#!/Paging
我的问题是,在切换到4和5后有8页,应该分别出现6和7,并且应该保留“ 1 2 3 4 5 6 7 8” ,但是在切换到6 I之后将具有此“ 1 ... 3 4 5 6 7 8”
以下是负责页面列表形成的功能:
private getPages(currentPage: number, totalPages: number): Page[] {
const pages: Page[] = [];
let startPage = 1;
let endPage = totalPages;
const isMaxSized = this.maxSize < totalPages;
if (isMaxSized) {
startPage = Math.max(currentPage - Math.floor(this.maxSize / 2), 1);
endPage = startPage + this.maxSize - 2;
if (this.page >= 1 && this.page <= 5) {
endPage = startPage + this.maxSize - 3;
}
if (this.page >= this.totalPages - 4) {
endPage = startPage + this.maxSize - 1;
}
if (this.page === 4 || this.page === 5) {
endPage++;
}
if (endPage > totalPages) {
endPage = totalPages;
// startPage = endPage - this.maxSize + 4;
}
}
for (let num = startPage; num <= endPage; num++) {
const page = PaginationComponent.makePage(num, num.toString(), num === currentPage);
pages.push(page);
}
if (totalPages > 7) {
if (startPage > 1) {
const previousPageSet = PaginationComponent.makePage(startPage - 1, '...', false);
pages.unshift(previousPageSet);
}
if (endPage < totalPages) {
const nextPageSet = PaginationComponent.makePage(endPage + 1, '...', false);
pages.push(nextPageSet);
}
}
return pages;
}