element中使用前端分页
2020-04-22 04:16
1251 查看
前端分页
当后端没有分页的时候 用element中的组件分页并不能对数据进行切割 需要请求回数据后自己来做切割
<el-table :data="tableData.slice((currentPage-1)*pageSize,currentPage*pageSize)" :height="$TABLE_HEIGHT-55" style="width: 100%">
- currentPage 当前页数
- pageSize 每页的数据个数
- slice(n,m)查找数组中两个索引之间的内容 返回新数组从n开始不含m
<!--分页组件--> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-size="pagesize" layout="total, sizes, prev, pager, next" :total=total> </el-pagination>
- size-change 是pageSize 改变时会触发的函数
- current-change 是currentPage 改变时会触发的函数
handleSizeChange(val) { this.pagesize = val; }, handleCurrentChange(val) { this.currentPage = val; }
- 点赞
- 收藏
- 分享
- 文章举报
相关文章推荐
- 一、jq前端分页插件pagination使用
- 前端学习(六):前端element-ui使用
- mybatis分页插件使用案例(前端bootstrap)
- Extjs中grid前端分页使用PagingMemoryProxy【二】
- bootstrap table使用:前端分页,获取值栈中的json值,加载到table中,获取选中的行信息
- [ios前端开发笔记]使用scrollView进行分页
- 使用layui前端框架,进行分页,php通过url传参
- [后端人员耍前端系列]KnockoutJs篇:使用KnockoutJs+Bootstrap实现分页
- EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之:使用BootstrapPagination以分页形式展示数据信息
- Extjs中grid前端分页使用PagingMemoryProxy【二】
- [后端人员耍前端系列]KnockoutJs篇:使用KnockoutJs+Bootstrap实现分页
- Django中使用JS通过DataTable实现表格前端分页,每页显示页数,搜索等功能
- vue-cli安装element-ui及分页组件使用
- Django中使用JS通过DataTable实现表格前端分页,每页显示页数,搜索等功能
- easyui 插件datagrid扩展应用:动态拼接二维列,表格底部合计行,前端分页,前端生成报表,使用小结:
- 前端分页插件bootstrapPaginator的使用
- EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之:使用BootstrapPagination以分页形式展示数据信息
- [后端人员耍前端系列]KnockoutJs篇:使用KnockoutJs+Bootstrap实现分页
- vue中后端返回一个对象是前端需要使用element的table渲染
- vue elementUI 前端手写分页功能