VueJs how to make pagination with limiter and range..?

Answer 1

Check out this code:

https://jsfiddle.net/os7hp1cy/48/

html:

    

    
       {{ pageNumber+1 }}
    

css:

a.first::after {
  content:'...'
}

a.last::before {
  content:'...'
}

Basically, it only shows pagination that is within 2 pages of the current page. Then it will also show page 1 and the last page, and will put "..." before or after the number with CSS. So if you are on page 10, it will show:

1... 8 9 10 11 12 ...21