分页器省略号算法

首先我们得知道省略号出现的时候是什么情况：

1.省略号在尾部

2.省略号在两边

3.省略号在头部

方法实现

totalPagesValue为总页数 PageNoValue为当前页

   // 如果小于 10 页就直接返回总页数
    if (totalPagesValue < 10) {
        return totalPagesValue
    }
    // 当前页数小于等于 5 时，返回含末尾省略号的数组
    if (PageNoValue <= 5) {
        return [1, 2, 3, 4, 5, 6, '...', totalPagesValue]
        // 当前页数大于等于总页数 - 5时 返回含前部分省略号的数组
    } else if (PageNoValue >= totalPagesValue - 5) {
        return [1, '...', totalPagesValue - 6, totalPagesValue - 5, totalPagesValue - 4, totalPagesValue - 3, totalPagesValue - 2, totalPagesValue - 1, totalPagesValue]
        // 否则返回显示两端含有省略号的数组
    } else {
        return [1, '...', PageNoValue - 3, PageNoValue - 2, PageNoValue - 1, PageNoValue, PageNoValue + 1, PageNoValue + 2, PageNoValue + 3, '...', totalPagesValue]
    }
}

但是需要再多加一层判断，不然点击到省略号的时候会出现bug，可能还有一些其他bug，于是我换成for循环实现：

let misc = ref<string>('...')
function setbtns() {
    // 清空按钮组
    pageButtons.value = []

    // 如果小于 10 页就返回 总页数
    if (totalPagesValue < 10) {
        for (let i = 1; i <= totalPagesValue; i++) {
            pageButtons.value?.push(i);
        }
        return pageButtons.value
    }
    // 声明新数组用于接收push
    let btns = new Array<any>()

    // 当前页码 <= 4 {
    //左侧显示所有 + 当前页码 + 右侧2个页码 + ... + 尾页

    //当前页码 > 4 且<= 页面总数(n) - 3 {
    //首页 + ... + 左侧2个页码 + 当前页码 + 右侧2个页码 + ... + 尾页

    //当前页码 > 页面总数(n) - 3 {
    //首页 + ... + 左侧2个页面 + 当前页码 + 右侧显示所有
    if (PageNoValue <= 4) {
        for (let i = 1; i <= PageNoValue + 2; i++) {
            btns.push(i)
        }
        btns.push(msic)
        btns.push(totalPagesValue)

    } else if (PageNoValue > 4 && PageNoValue <= totalPagesValue - 3) {
        btns.push(1)
        btns.push(msic)
        for (let i = PageNoValue - 2; i <= PageNoValue; i++) {
            btns.push(i)
        }
        btns.push(msic)
        btns.push(totalPagesValue)
    } else if {
        btns.push(1)
        btns.push(msic)
        for (let i = PageNoValue - 2; i <= totalPagesValue; i++) {
            btns.push(i)
        }
    }
    return pageButtons.value = btns
}