Пагинация с JS - PullRequest
       10

Пагинация с JS

0 голосов
/ 10 июня 2019

Я хочу сделать нумерацию страниц в таком формате: 1, 2, 3, ..., latest three.

Это мой код:

let skip = null;
    if(pageCount > 10){
        skip = <li><span>...</span></li>
    }
for(let i = 1; i <= pageCount; i++) {

    if((i < page + 3 && i > page - 3)){
            result.push(
                <li key={i}>some link</li>
            );
            continue;
        } else if(skip){
            result.push(skip);
            skip = null;
        }
}

У меня есть pageCount, что для примера 20 иpage, который является номером текущей страницы, например - 3.

Я пробовал много вещей, но все еще не могу понять, как это сделать.

Формат, который я пытаюсь сделать, это

, если page=10, pageCount=20:

8, 9, 10, ..., 18, 19, 20.

Если page=1:

1, 2, 3, ..., 18, 19, 20.

Если page=20:

1, 2, 3, ..., 18, 19, 20.

Ответы [ 3 ]

1 голос
/ 10 июня 2019

Мое решение похоже на:

function p(page, pageCount = 20){
    pagination = []

    if(page - 3 < 0 || page > pageCount - 3)
        pagination = [1,2,3, '...',pageCount-2, pageCount-1, pageCount-0]

    else {
        for(let i = page-2; i <= page; i++) {
            pagination.push(i)
        }
        pagination.push('...',pageCount-2, pageCount-1, pageCount-0)
    }

    return pagination
}



console.log('page = 10 => ', p(10))
console.log('page = 1 => ', p(1))
console.log('page = 20 => ', p(20))

Результаты:

  • page = 10 => (7) [8, 9, 10, "...", 18, 19, 20]
  • page = 1 => (7) [1, 2, 3, "...", 18, 19, 20]
  • page = 20 => (7) [1, 2, 3, "...", 18, 19, 20]
1 голос
/ 10 июня 2019
function getRange(page, pageCount, offset) {
  let results = [...Array(pageCount + 1).keys()];
  const skip = '...';

  results = results.slice(page, pageCount + 1);
  results.splice(offset, 0, skip);
  results.splice(offset + 1, results.length - (offset + 1) - offset);

  return results;
}

Выходы:
console.log(getRange(1, 20)); //[ 1, 2, 3, "...", 18, 19, 20 ] console.log(getRange(10, 20)); //[ 10, 11, 12, "...", 18, 19, 20 ]

1 голос
/ 10 июня 2019

вы близки к решению.

Может быть, это поможет вам

function smartPagination(current, last){
    var delta = 2,
    left = current - delta,
    right = current + delta + 1,
    range = [],
    rangeWithDots = [],
    l;

    for (let i = 1; i <= last; i++) if (i == 1 || i == last || i >= left && i < right) range.push(i);

    for (let i of range) {
        if (l) {
            if (i - l === 2) rangeWithDots.push(l + 1);
            else if (i - l !== 1) rangeWithDots.push('...');
        }
        rangeWithDots.push(i);
        l = i;
    }

    return rangeWithDots;
}
//Outputs: [1, 2, 3, "...", 9, 10]
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...