element ui分页器的使用
<el-pagination
layout="total, prev, pager, next, jumper"
:current-page="pageInfo.page"
@current-change="onPageChange"
:total="totalElementsData">
</el-pagination>
current-page表示的是当前的页数,就传data里面定义的就好,total表示的是总页数,current-change表示的是分页时候的事件
pageInfo: {
page: 1,
size: 10,
},
totalElementsData:0,
onPageChange (page) {
this.pageInfo.page = page
this.fetchData()
},
fetchData (data = {}) {
this.listLoading = true
setTimeout(() => {
this.listLoading = false
}, 20000)
this.criteria.page = this.pageInfo.page
this.criteria.size = this.pageInfo.size
var { name,contact, createStart,createEnd, checkStart,checkEnd, status ,page, size} = this.criteria
var params ={ name, contact, createStart, createEnd, checkStart, checkEnd, status,page, size}
fetchBusiness.cashManageData(params).then(res => {
this.loading = false
if (res.status === 200) {
this.listLoading = false
this.getCashList = res.data.data.content
this.totalElementsData = +res.data.data.totalElements //这里获取totalElementsData数据
} else {
this.$message({
message: res.data.message,
duration: 3000
})
}
})
},
element ui分页器的使用的更多相关文章
- 使用element ui 日期选择器获取值后的格式问题
一般情况下,我们需要给后台的时间格式是: "yyyy-MM-dd" 但是使用Element ui日期选择器获取的值是这样的: Fri Sep :: GMT+ (中国标准时间) 在官 ...
- element ui 1.4 升级到 2.0.11
公司的框架 选取的是 花裤衩大神开源的 基于 element ui + Vue 的后台管理项目, 项目源码就不公开了,记录 分享下 步骤 1. 卸载 element ui 1.4的依赖包 2. 卸载完 ...
- [坑况]饿了么你是这样的前端——vue+element ui 【this dependency was not found:'element-ui/lib/theme-chalk/index.css'】
element ui 坑况:今日pull代码,潇洒npm run dev ,被告知:this dependency was not found:'element-ui/lib/theme-chalk/ ...
- Vue + Element UI项目初始化
1.安装相关组件 1.1安装Node 检查本地是否安装node node -v 如果没有安装,从Node官网下载 1.2安装npm npm -v 如果没有安装:使用该指令安装: npm install ...
- Element UI——本地引入iconfont不显示
前言 前面因为本地引入Element UI导致了iconfont不显示,所以只好再去Element UI官网去扒下iconfot 步骤 进入官网 组件 | Element UI F12进入控制台,找到 ...
- Html | Vue | Element UI——引入使用
前言 做个项目,需要一个效果刚好Element UI有,就想配合Vue和Element UI,放在tp5.1下使用,但是引入在线的地址各种报错,本地引入就完美的解决了问题! 代码 __STATIC_J ...
- 分享一个自搭的框架,使用Spring boot+Vue+Element UI
废弃,新的:https://www.cnblogs.com/hackyo/p/10453243.html 特点:前后端分离,可遵循restful 框架:后端使用Spring boot,整合了aop.a ...
- 上传图片组件封装 element ui
// element ui 文档地址: http://element.eleme.io/#/zh-CN <template> <div> <div class=" ...
- vue项目使用element ui的Checkbox
最近使用到element ui的下拉多选框Checkbox Checkbox用法可参考与于 http://element.eleme.io/#/zh-CN/component/checkbox Che ...
随机推荐
- Java自学-数组 增强型for循环
Java 中如何使用增强for循环 增强型for循环在遍历一个数组的时候会更加快捷 步骤 1 : 增强型for循环 注:增强型for循环只能用来取值,却不能用来修改数组里的值 public class ...
- 30个关于Shell脚本的经典案例(上)
对于初学者而言,因为没有实战经验,写不出来Shell脚本很正常,如果工作了几年的运维老年还是写不出来,那就是没主动找需求,缺乏练习,缺乏经验.针对以上问题,总结了30个生产环境中经典的Shell脚本, ...
- Android Scroller详解
在学习使用Scroller之前,需要明白scrollTo().scrollBy()方法. 一.View的scrollTo().scrollBy() scrollTo.scrollBy方法是View中的 ...
- Word2Vec算法简介
一.简介 word2vec是Google在2003年开源的一款将词表征为实数值向量的高效算法,采用的模型有CBOW[Continuous Bag-Of-Words 连续的词袋模型]和Skip-Gram ...
- Python爬虫系列:五、正则表达式
1.了解正则表达式 正则表达式是对字符串操作的一种逻辑公式,就是用事先定义好的一些特定字符.及这些特定字符的组合,组成一个“规则字符串”,这个“规则字符串”用来表达对字符串的一种过滤逻辑. 正则表达式 ...
- docker启动报错解决及分析(Cannot create container for service *******: cannot mount volume over existing file, file exists /var/lib/docker/overlay2/)
现象: Cannot create container for service *******: cannot mount volume over existing file, file exists ...
- 10 分钟上手 Vue 组件 Vue-Draggable
Vue 综合了 Angualr 和 React 的优点,因其易上手,轻量级,受到了广泛应用.成为了是时下火热的前端框架,吸引着越来越多的前端开发者! 本文将通过一个最简单的拖拽例子带领大家快速上手 V ...
- docker 常见问题处理汇总
问题一: docker执行docker info出现如下警告WARNING: bridge-nf-call-iptables is disabledWARNING: bridge-nf-call-ip ...
- mysqdump+binlog恢复数据
备份全库 [root@db01 b]# mysqldump -uroot -poldboy123 -A > /b/full.sql Warning: Using a password on th ...
- mongodb 安装pymongo 驱动
下载驱动包: https://pypi.org/project/pymongo/ 解压: tar zxvf pymongo-3.8.0.tar.gz 安装: python setup.py i ...