按照他的文档来写分页

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

<el-table :data="AllCommodityList.slice((currentPage-1)*pagesize,currentPage*pagesize)" border style="width: 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;
},

vue+element-ui实现前端分页的更多相关文章

  1. vue2.0+Element UI 表格前端分页和后端分页

    之前写过一篇博客,当时对element ui框架还不太了解,分页组件用 html + css 自己写的,比较麻烦,而且只提到了后端分页 (见 https://www.cnblogs.com/zdd20 ...

  2. vue + element ui 表格自定义表头,提供线上demo

    前言:工作中用到 vue+element ui 的前端框架,需要使用自定义表头,需要使用 re.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9710826.h ...

  3. vue+element ui 的上传文件使用组件

    前言:工作中用到 vue+element ui 的前端框架,使用到上传文件,则想着封装为组件,达到复用,可扩展.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9 ...

  4. vue+element ui 的表格列使用组件

    前言:工作中用到 vue+element ui 的前端框架,有这个场景:很多表格的列有许多一样的,所以考虑将列封装为组件.转载请注明出处:https://www.cnblogs.com/yuxiaol ...

  5. vue+element ui 的tab 动态增减,切换时提示用户是否切换

    前言:工作中用到 vue+element ui 的前端框架,动态添加 Tab,删除 Tab,切换 Tab 时提示用户是否切换等,发现 element ui  有一个 bug,这里记录一下如何实现.转载 ...

  6. vue+element ui 的时间控件选择 年月日时分

    前言:工作中用到 vue+element ui 的前端框架,需要选择年月日时分,但element ui官网demo有没有,所以记录一下.转载请注明出处:https://www.cnblogs.com/ ...

  7. 基于vue(element ui) + ssm + shiro 的权限框架

    zhcc 基于vue(element ui) + ssm + shiro 的权限框架 引言 心声 现在的Java世界,各种资源很丰富,不得不说,从分布式,服务化,orm,再到前端控制,权限等等玲琅满目 ...

  8. 分享一个自搭的框架,使用Spring boot+Vue+Element UI

    废弃,新的:https://www.cnblogs.com/hackyo/p/10453243.html 特点:前后端分离,可遵循restful 框架:后端使用Spring boot,整合了aop.a ...

  9. Vue + Element UI 实现权限管理系统

    Vue + Element UI 实现权限管理系统 前端篇(一):搭建开发环境 https://www.cnblogs.com/xifengxiaoma/p/9533018.html

  10. vue + element ui 实现实现动态渲染表格

    前言:之前需要做一个页面,能够通过表名动态渲染出不同的表格,这里记录一下.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9786326.html 网站地址:我的 ...

随机推荐

  1. [转]JAVA回调机制(CallBack)详解

    看见一篇博客比较通俗的解释了回调机制,转载一下,感谢原文作者Bro__超,原文地址:http://www.cnblogs.com/heshuchao/p/5376298.html 序言 最近学习jav ...

  2. shiro登陆权限验证

    一>引入shirojar包 <!-- shiro登陆权限控制 -->        <dependency>            <groupId>org. ...

  3. 全文检索引擎及工具 Lucene Solr

    全文检索引擎及工具 lucence lucence是一个全文检索引擎. lucence代码级别的使用步骤大致如下: 创建文档(org.apache.lucene.document.Document), ...

  4. Assembly之example

    Here is a simple example by assembly language. It is based on openMSP430. Very important is to under ...

  5. Python之global

    1 Global The global statement and its nonlocal cousin are the only things that are remotely like dec ...

  6. SiftGPU:编译SiftGPU出现问题-无法解析的外部符号 glutInit

    OpenCV出现了ORB特征和SURF的GPU版本, 参考:opencv上gpu版surf特征点与orb特征点提取及匹配实例至于使用什么并行API暂时没有探究. 但没有发现OpenCV-SIFT的GP ...

  7. .NET Framework 3.5 安装

    今天vCenter服务器悲剧了,只好火速重新部署新vCenter服务器... Windows server 2016 中,安装VCenter 5.5 提示  未安装 .NET Framework 3. ...

  8. 在Android 上运行 openCV ,并做灰度变化的一个例子

    OpenCVImageProcessing1. 导入Opencv的 androrid SDK灰度算法 OpenCVImageProcessing 导入opencv Jar包,配置OpenCVLibra ...

  9. Lua的热更新学习笔记_01

    热更新的的实现方式 1.使用lua脚本编写游戏的UI或者其他的逻辑 2.使用C#的反射技术 3.使用C#Light AssetBundle是什么? 1.unity提供一个资源更新技术,就是通过Asse ...

  10. leetcode 188-maxProfit

    public static int maxProfit(int k, int[] prices) { if (0 >= k || null == prices || 1 >= prices ...