element-ui分页改写，一行代码调用

element提供的分页是已经封装好的组件,在这里再次封装是为了避免每个用到分页的页面点击跳转时都要写一遍跳转请求，传入请求数据函数

<!--分页组件-->
<template>
  <el-pagination small @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="pageSizes" :page-size="pageSize" :layout="layout" :total="total">
  </el-pagination>
</template>
<script>
export default {
  name: 'erpPagination',
  props: {
    pageSize: [Number, String],
    currentPage: [Number, String],
    total: [Number, String],
    render: [Function],
    hideOnSinglePage:true,//单页显示
    pageSizes: {
      type: Array,
      default: function() {
        return [10, 20, 30, 40, 50]
      }
    },
    layout: {
      type: String,
      default: 'total, sizes, prev, pager, next, jumper'
    }
  },
  methods: {
    handleSizeChange(val) {
      this.$emit('update:pageSize', val)
      this.render();
    },
    handleCurrentChange(val) {
      this.$emit('update:currentPage', val)
      this.render();
    }
  }
};
</script>

调用方式
<pagination
:current-page.sync="pageTotal.page"
:total="pageTotal.total"
:page-size.sync="pageTotal.pageSize"
:render="getData">
</pagination>

import Pagination from '../Pagination';
export default {
  components: {
    'pagination': Pagination
  },
}