vue实现分页功能

<el-pagination     layout="prev, pager, next"     @current-change="changePageNum"     :current-page="pageNum"     :page-size="pageSize"     :total="total"></el-pagination>

data（）{return{   tableData: [],        total: 0,//总数        pageNum: 1,//当前页        pageSize: 15,//每页显示数量}}  mounted: function () {      this.query();//加载页面时，获取数据    },    methods:{       //切换页码        changePageNum: function (val) {        this.pageNum = val;        this.query();      },      //通过接口，获取数据    query: function () {        var data = {          name: this.name || '',          fleetId: this.FleetId,          pageNum: this.pageNum,//当前页          pageSize: this.pageSize//查询个数        };        RoleManage.getRole(data)        .then(res => {          var data = res;          if (res.success) {            this.tableData = data.obj.list;            this.total = data.obj.total;            this.name ='';          } else {            this.$message('查询失败');          }        }).catch(err => {          // 异常情况          console.log(err);        });      },         }

//调度-系统通讯录分页        dispatchCourentPage: 1,        //调度-系统通讯录当前选中标签标记        dispatchCourentIndex: 1,        //调度-系统通讯录更多标记项:组id        dispatchMorecommandGroupId: '',        dispatchTotlePage: 0,//上页 handleLastPage() {        if (this.dispatchCourentPage === 1) return;        this.dispatchCourentPage -= 1;        let index = this.dispatchCourentIndex;        if (this.dispatchMorecommandGroupId != '') {          this.queryBookMoreBygroupId(this.dispatchMorecommandGroupId);        } else {          this.queryBookmember(index);        }      },//下页 handleNextPage() {   if (this.dispatchCourentPage === this.dispatchTotlePage) return;   this.dispatchCourentPage += 1;   let index = this.dispatchCourentIndex;   if (this.dispatchMorecommandGroupId != '') {     this.queryBookMoreBygroupId(this.dispatchMorecommandGroupId);   } else {     this.queryBookmember(index);   } }

computed: {      limitData() {        let data = [...this.table1Datas];        return data;      },            // 因为要动态计算总页数，所以还需要一个计算属性来返回最终给 Table 的 data      dataWithPage() {        const data = this.limitData;        const start = this.current * this.size - this.size;        const end = start + this.size;        return [...data].slice(start, end);      },  }

/**   *根据数据条数与每页多少条数据计算页数    * totalnum 数据条数   * limit 每页多少条  */ pageCount(totalnum, limit) {     return totalnum > 0 ? ((totalnum < limit) ? 1 : ((totalnum % limit)        ? (parseInt(totalnum / limit) + 1)         : (totalnum / limit))) : 0; },

/**   * 分页的总页数算法   * 总记录数：totalRecord   * 每页最大记录数：maxResult */ function pageCount() {     totalPage = (totalRecord + maxResult -1) / maxResult;}

totalPage  = Math.floor((totalRecord  +maxResult -1) /maxResult );