elementUI中page（分页）的使用方法

HTML部分

<!-- 快捷键 page-div -->
<el-pagination
  background
  layout="sizes,prev, pager, next"
  :total="data.table.total"
  :page-size="config.page.count"
  :page-sizes="[10,30,50,70,100]"
  :current-page="config.page.index"
  @current-change="pageToMe"
  @size-change="changePageMe"
>
</el-pagination>

---

data部分

// data部分 快捷键page-js-data
config: {
  page: {
    count: 10,
    index: 1
  }
}

---

methods部分

// methods 快捷键 page-js-me
// 点击上一页、下一页以及指定页
pageToMe (index) {
  const info = this.$pageSet('test', null, index)
  this.config.page = info
},
// 改变每页显示的条数
changePageMe (index) {
  const info = this.$pageSet('test', index, 1)
  this.config.page = info
},
async getList(){
  const data = await this.$http.get('?count=' + this.config.page.count + '&index=' + this.config.page.index)
  if(data){
  this.data=data
  }
}

---

mounted部分

// 快捷键 pgae-js-mo
// 页面初始化值，一定要写
this.config.page = this.$pageSet('test',this.config.page)
this.getList()

---

如果涉及到搜索则在methods部分增加搜索按钮，并给搜索按钮增加以下方法

search(){
  // 为了避免非搜索模式下index调到N页，但是搜索结果没有这么多页导致查不到，所以要重置index页和count数量
  this.config.page = this.$pageSet('rwap-index', { count: 10, index: 1 }, false)
  this.getList()
}