var newToAddLeave = function(){var goIndex = {template:`<i-table :columns="overTimeList.columns" :data="overTimeList.data" no-data-text="暂无数据"></i-table><div class="vue-system-page"><Page  :current="1" :show-total="true" :total="overTimeList.total" :page-size="5" :page-size-opts="[10, 20, 30, 40]" :show-elevator="true" @on-change="handlePage"></div></Page>`,data:function(){return {overTimeList:{columns:[],data:[],total:0,page:1,checkedNames: []}}},methods:{textData:function(){var list = [];var _this = this;_this.$Loading.start();_this.$Message.loading("");for(var i=0; i<18; i++){list.push(Mock.mock({"Serial":'@increment',"Applicant":"@cname","ApplicantType": 'trms',"StartTime":'@date("yyyy-MM-dd")',"endTime|":'@date("yyyy-MM-dd")',"days|1-10":10,"processName|1": ['tmrs','新闻','员工有话说','portal'],"action": '001',"Manage": '@clast',"processTime|1": ['2017-1-30'],"sydays|1": [2,3],"beizhu": '@ctitle(3, 5)',}));}_this.overTimeList.data = list;_this.overTimeList.total = list.length;setTimeout(function(){_this.$Loading.finish();_this.$Message.destroy();},2000)},handlePage:function(val){this.page = val;this.textData();},getOverTimeList:function(){var self = this;self.overTimeList.columns =  [ {title: '序号',key: 'Serial',align:'center'},{title: '申请人',key: 'Applicant',align:'center'},{title: '申请类型',key: 'ApplicantType',align:'center'},{title: '开始日期',key: 'StartTime',align:'center'},{title: '结束日期',key: 'endTime',align:'center'},{title: '天数',key: 'days',align:'center'},{title: '项目名称',key: 'processName',align:'center'},{title: '操作',key: 'action',align:'center'},{title: '经办人',key: 'Manage',align:'center'}, {title: '处理时间',key: 'processTime',align:'center'},{title: '剩余天数',key: 'sydays',align:'center'},{title: '备注',key: 'beizhu',width:200,}];}},ready:function(){this.getOverTimeList();this.textData();}}return new Vue({el:'#app2',components:{goIndex:goIndex}})}()

转载于:https://www.cnblogs.com/zhujiasheng/p/6493004.html

分享一下vue ui的分页的用法相关推荐

  1. 详解Vue中watch的高级用法

    转载自  详解Vue中watch的高级用法 我们通过实例代码给大家分享了Vue中watch的高级用法,对此知识点有需要的朋友可以跟着学习下. 假设有如下代码: 1 2 3 4 5 6 7 8 9 10 ...

  2. 分享几个实用的国内可访问Vue ui库

    前言: Vue的ui库众多,大多的UI库都由国外小组开发制作,故访问外国官网龟速,笔者介绍几个国内能正常访问的库. H5端: 1.Vant 轻量.可靠的移动端 Vue 组件库,色彩丰富,组件居多,更重 ...

  3. SAP UI 搜索分页技术

    搜索分页技术往往和另一个术语Lazy Loading(懒加载)联系起来.今天由Jerry首先介绍S/4HANA,CRM Fiori和S4CRM应用里的UI搜索分页的实现原理.后半部分由SAP成都研究院 ...

  4. ElementUI+VUE 日期控件禁用用法

    今天给大家整理一下ElementUI+VUE 日期控件禁用用法,希望对大家有所帮助! HTML文件 <el-date-pickerv-model="value"type=&q ...

  5. 推荐 21 个顶级的 Vue UI 库

    前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家.点击跳转到教程. 1.Vuetify Star 数为 11K,提供了 80 多个 Vue.js 组件,这些组件是根据谷 ...

  6. vue ui报错 Couldn‘t parse bundle asset “C:\Users\cqq\Desktop\vuex\vuex_demo\dist\js\chunk-vendors.js“.

    1. vue ui 运行编译项目时报错: Couldn't parse bundle asset  文件路径\\dist\js\chunk-vendors.js". Analyzer wil ...

  7. 输入vue ui没反应

    在cmd中输入 vue ui没有反应 输入 vue -h查看,发现是版本太低,根本没有ui 这是因为vue的版本太低导致的, 输入cnpm i -g @vue/cli 升级脚手架即可 升级完成后,输入 ...

  8. UI培训分享:学UI设计需要知道哪些事情?

    很多同学都想要学习UI设计技术,因为UI设计行业的发展前景非常不错,通过成为一名合格的UI设计师能够够更好的进入到互联网行业,那么学UI设计需要知道哪些事情呢?先来看看下面的详细介绍. UI培训分享: ...

  9. 使用amaze ui的分页样式封装一个通用的JS分页控件

    作为一名码农,天天百度.偶尔谷歌,所有代码全靠copy,用第三方插件,偶尔也想着造造轮子,毕竟自己的骨肉总归比较亲. 今天有点空闲时间,想起我们公司之前套的页面的分页插件上还有bug,而写那个分页插件 ...

最新文章

  1. dst matlab,DSTcode DST跟踪算法MATLAB代码,复杂环境中仿多目标 实现的单 Other systems 其他 272万源代码下载- www.pudn.com...
  2. MySQL语法语句大全
  3. 牛客网 暑期ACM多校训练营(第一场)J.Different Integers-区间两侧不同数字的个数-离线树状数组 or 可持久化线段树(主席树)...
  4. Navicat怎样筛选数据
  5. mysql允许远程访问
  6. Python入门-day1变量和简单数据类型
  7. out参数不用赋值?这么神奇吗!
  8. linux 改变当前目录,Linux下使用Shell脚本改变当前工作路径
  9. Android App自动更新解决方案(DownloadManager)
  10. 《人件(原书第3版)》—— 01 此时此刻,一个项目正在走向失败
  11. 2021-10-08梦笔记
  12. pywifi 破解WiFi密码
  13. Ubuntu安装酷的桌面监控陈程序Conky
  14. 数学实验4:Matlab作图实验
  15. 使用wagtail搭建cms的安装流程
  16. AADL Inspector 故障树安全分析模块
  17. 迷惘_飘云羽逸_新浪博客
  18. 智能推荐系统开发中的十大要素
  19. U3D DotH教程3
  20. Java Stream map flatMap mapMulti的升维和降维

热门文章

  1. 【机器视觉】 dev_set_tool_geometry算子
  2. 【linux系统编程】进程间通信:信号中断处理
  3. java 洗牌_java数组之完美洗牌算法
  4. android+定时器+动画,Android 实现定时器的四种方式总结及实现实例_Android_脚本之家...
  5. 将vue部署在nginx上
  6. 关于eclipse中web项目tomcat报错Server Tomcat v9.0 Server at localhost failed to start问题解决
  7. matlab-Grefenstette的编码与解码
  8. 初学PX4之飞控算法
  9. HDU - Dogs' Candies
  10. c++动态内存的几个简单例子