【Vue】手把手教你用vue.js实现一个分页组件

最近在用vue做博客，要实现一个文章的分页效果，做出来后，顺便记录一下实现的思路，
先看一下效果：

• 第一页时，prev箭头不显示，最后一页时next箭头不显示，随着当前分页的不同，渲染不同的文章列表

• 需要定义下面几个变量：

  currentPage: 1, ，默认是1，表示当前所在的页码
  totalPage: 1, 默认是1，表示总共有多少页
  currentArticleList: [], 当前页的文章列表
  totalArticleList:[]，全部的文章列表
  count：5， 每页显示的文章数量

• 其中totalPage = totalArticleList / count， 然后在进行向上取整，比如说你有6篇文章，count为5，6/5 = 1.2，取整后就是totalPage两页

• 实现的大概思路就是每次点击prev或者next时，吧上一次的currentArticleList清空，然后从totalArticleList吧当前页对应的博客push到currentArticleList数组里面，使用v-for循环进行渲染

methods里面有三个函数：

1. initPageList()，在页面初始化（mounted钩子函数）的时候调用：

  initPageList() {
      for(let i = (this.currentPage-1)*this.count; i < this.currentPage*this.count; i++) {
          if(this.totalArticleL