ページネーションの実装

何ページのときにどの数字を表示させるべきががあまりわからなかったので、調べた。

下記ページがでてきた。

アルゴリズムがわかりやすく、このまま実装した(パクらせていただいた)。

function pages(c, n) {
    if (c < 5) {
      return [1, 2, 3, 4, 5, 0, n];
    }
    if (c > n - 4) {
      return [1, 0, n - 4, n - 3, n - 2, n - 1, n];
    }
    return [1, 0, c - 1, c, c + 1, 0, n];
  }

これをいい感じにTypeScriptに変換。下パクったあと

const pages = (c: number, n: number): number[] => {
    const maxPage = 5
    const arr: number[] = [];
    if (n <= maxPage) {
        for (let index = 0; index < n; index++) {
            arr.push(index + 1);
        }
        return arr;
    }
    if (c < maxPage) {
        for (let index = 0; index < maxPage; index++) {
            arr.push(index + 1);

        }
        arr.push(-1);
        arr.push(n);
        return arr;
    }
    if (c > (n - maxPage + 1)) {
        arr.push(1);
        arr.push(-1);
        for (let index = maxPage - 1; index >= 0; index--) {
            arr.push(n - index);
        }
        return arr;
    }
    return [1, -1, c - 1, c, c + 1, -1, n];
}

特殊文字について

矢印とか、3連ドットなどの文字を表示するためのコード

以下を参考にした