封装一个优雅的element ui表格组件

现在做后台系统用vue + elementUI 的越来越多,那element ui的 el-table 组件肯定也离不开。虽然element ui的table组件很好。但是表格和分页是分离的。每次写表格的时候都要写分页。这个就比较麻烦了。那我们可不可以把表格和分页封装在一起呢?照这个思路那我们重新封装一个带分页的表格。

思路:

  1. 表格组件要包含分页,不用每次都重新写分页
  2. 尽量保证el-table原生方法
  3. 方便易用

照这个思路我们开始写代码
先把表格和分页写在一起


别人使用起来非常简单 ,也不用再写任何请求方法
可以全局引入

 
    //下面的使用方式和el-table一样
    
            
        
        
            
        
    

如果想刷新数据 使用reload方法即可. this.$refs.table.reload()

你可能感兴趣的:(封装一个优雅的element ui表格组件)