zoukankan      html  css  js  c++  java
  • vue+element-ui实现前端分页

    按照他的文档来写分页

    最主要的是  el-table里面展示的数据怎么处理

    <el-table :data="AllCommodityList.slice((currentPage-1)*pagesize,currentPage*pagesize)" border style=" 100%">
    (上面这句代码才是重点,下面的都是看他的文档写的,
      AllCommodityList 是我后台取出来的数据,
    currentPage 当前页初始值设置为0
    pagesize 是当前页要展示多少条数据,默认10

    补充:slice() 方法可从已有的数组中返回选定的元素。
    <!--分页-->
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="pagesize"
        layout="total, sizes, prev, pager, next, jumper"
        :total=parseInt(total)>
      </el-pagination>
     
        handleSizeChange(val) {
            this.pagesize = val;
    //        console.log(`每页 ${val} 条`);
          },
          handleCurrentChange(val) {
            this.currentPage = val;
          },
  • 相关阅读:
    DynamicObject
    ABP文档
    ABP文档
    ABP文档
    ABP文档
    ABP文档
    ABP文档
    第1张 Maven简介 学习笔记
    lambda表达式10个示例——学习笔记
    对象在内存中初始化的过程?
  • 原文地址:https://www.cnblogs.com/mophy/p/8604717.html
Copyright © 2011-2022 走看看