业务:

  1.      ![image.png](https://cdn.nlark.com/yuque/0/2021/png/21762447/1624893887543-8f7ab80c-850d-4e3c-97d0-9e616feed75c.png#clientId=u97fe44e9-faea-4&from=paste&height=337&id=u60c35b23&margin=%5Bobject%20Object%5D&name=image.png&originHeight=337&originWidth=464&originalType=binary&ratio=1&size=21514&status=done&style=none&taskId=u9cc9686c-d0e9-4295-959b-c582c4ed72b&width=464)

最终实现的效果:

  1.     ![image.png](https://cdn.nlark.com/yuque/0/2021/png/21762447/1624893920404-0c549211-c2a1-4e68-b752-6b135cfcae1d.png#clientId=u97fe44e9-faea-4&from=paste&height=90&id=u65787275&margin=%5Bobject%20Object%5D&name=image.png&originHeight=90&originWidth=307&originalType=binary&ratio=1&size=6303&status=done&style=none&taskId=ud936da32-ee5a-49fb-9388-9210684484b&width=307)

代码演示:

  1.  /*
  2.         total       : 总条数
  3.         size        : 每页几条
  4.         page        : 当前第几页
  5.         btnCount    : 最多能看到几个按钮
  6.     */
  7.     function f(total,size,page,btnCount){
  8.         const arr  = []
  9.         // 总共几页
  10.         const pageNum =Math.ceil(total/size)  
  11.         if(page>pageNum) page = pageNum
  12.         if(page<=0) page=1
  13.         // 当前页数小于按钮数量一半 =》 [1,2,page,4,btnCount] 排序
  14.         if(page<=Math.ceil(btnCount/2)){
  15.             for(var i=1;i<=btnCount;i++){
  16.                 arr.push(i)
  17.             }
  18.             return  arr
  19.         }
  20.         // 当前页数 大于 总页数减去按钮数量一半 =》 [pageNum-btnCount, , page , ,pageNum] 排序
  21.         else if(page>=pageNum-Math.floor(btnCount/2)){
  22.             for(var i=pageNum;i>pageNum-btnCount;i--){
  23.                 arr.push(i)
  24.             }
  25.             return  arr.reverse()
  26.         }
  27.         // 其他情况 [page-Math.floor(btnCount/2) , , page, , , page+Math.ceil(btnCount/2) ] 排序
  28.         else{
  29.             for(var i=page-Math.floor(btnCount/2) ; i<page+Math.ceil(btnCount/2);i++){
  30.                 arr.push(i)
  31.             }
  32.             return arr
  33.         }
  34.     }
  35.   console.log(f(200,10,10,5))