element 實現分頁

1.定義初始值

data(){
   pageList:{
      total:0,  //總條數
      size:10,  //每頁顯示的數據
      page:1　　　//當前頁碼
    }
}

2.調用分頁的組件

<el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="Number(pageList.page)"
      :page-size="Number(pageList.size)"
      layout="sizes, prev, pager, next"
      :total="Number(pageList.total)">
    </el-pagination>

3. 實現效果

1.初始化數據
query(data){
      let option = {...data,...this.pageList}
      query(option).then(res=>{
        console.log(res)
      })
    }

2.
//改變每頁顯示的數量
    handleSizeChange(val) {
      this,pageList.size = val
      this.pageList.page = 1
      this.query(this.fromData)
    },
3.
//更改頁碼
 handleCurrentChange(val) {
      this.pageList.page = val
      this.query(this.fromData)
    }