vue---element el-pagination封装分页组件

需求描述：将分页组件封装为公共组件，在需要引用分页的页码引入即可。

解决思路：

假设分页组件为【Page.vue】（子组件），两个页面为父组件，分别为【PageOne.vue】和【PageTwo.vue】

（1）PageOne.vue（父组件）和PageTwo.vue（父组件）需要向Page.vue（子组件）传递总条数【total】，通过【props】属性传值实现

•       父组件：【】
•       子组件【props: ["total"]】

（2）子组件需要向父组件传递每页条数【pageSize】和当前页【currentPage】，使用this.$emit("function",param);   //其中function为父组件定义函数，param为需要传递的参数。 

•       父组件：【】
•        子组件：【this.$emit("pageChange", this.page);】

代码如下：

【Page.vue】

【PageOne.vue】

【PageTwo.vue】同【PageOne.vue】