element UI el-table 分页

首先引入控件

                <el-pagination
                    @current-change="current_change"
                    :current-page.sync="currentPage"
                    :page-size="pagesize"
                    layout="prev, pager, next, jumper"
                    :total="total">
                </el-pagination>

 data数据

           currentPage:1,

            total: 0,

            pagesize: 1000,

            currentData: []

 current-page 是绑定的页面 ,写在Data里      currentPage:1,

current_change 是 点击页面时触发的事件

current_change: function(currentPage) {

      let _this = this;

      _this.currentPage = currentPage;

      _this.currentData = _this.detailInfo.slice(      //detailinfo是你ajax后台查询出的全部数据,根据页码及pagesize,求出要显示的数据位置,currentData绑定到el-table  的data上    <el-table :data="currentData"。。。。。。。。

        (_this.currentPage - 1) * _this.pagesize,

        _this.currentPage * _this.pagesize

      );

    }

发布了89 篇原创文章 · 获赞 4 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/m0_37879526/article/details/104068704