Atitit easyui翻页组件与vue的集成解决方案attilax总结

===============使用1

===========\paggingUtil_easyui_vue.js2

C:\Users\Administrator\Desktop\00oa\js\paggingUtil_easyui_vue.js

===============使用

<!-- pagging-->

<link rel="stylesheet" type="text/css" href="easyui1.5/themes/default/easyui.css">

<link rel="stylesheet" type="text/css" href="easyui1.5/themes/icon.css">

<script src="easyui1.5/jquery.easyui.min.js"></script>

<script src="paggingCoreV3r44.js"></script>

<script src="js/paggingUtil_easyui_vue.js"></script>

<!-- pagging end-->

<script src="api_cfg.js"></script>

</head>

<!-- 翻页控件区域-->

<div class="easyui-pagination" id="page_div" ></div>

</div>

<!--  绑定翻页查询数据事件-->

$("#button11").on('click',function(){

var s2 ="select * from ROLE_PARSE where 流程 like '%"+$('#textfield').val()+"%'";

var url2 = api_url+"/api?m=q&p1="+encodeURIComponent(encodeURIComponent(s2));

fetch(url2).then(response=>response.json()).then(data => {

setPageControl(data);

}

).catch(e => console.log("Oops, error", e));

})

===========\paggingUtil_easyui_vue.js

// JavaScript Document

//绑定翻页查询数据事件-->

function getTestdata()

{

var a=new Array();

for(i=1;i<99;i++)

{

a.push(i);

}

return a ;

}

function  showCurPageData2Table(cur_page_datas)

{

VueObj1.$data.list_data1=cur_page_datas;

}

function   clrOldPageData()

{

VueObj1.$data.list_data1=[];

}

var all_data=getTestdata();//获取数据,可以一般是从后台ajax获取。。前段分页是获取所有数据,后端分页只获取当前页数据

function setPageControl(all_data)

{

//设置翻页

$('#page_div').pagination({

total:all_data.length,

pageSize:10,

onSelectPage: function(pageNumber, pageSize){

clrOldPageData();//清空现有显示数据

//截取当前页面数据

var cur_page_datas=getCurPageDatas(all_data,pageNumber,pageSize);

//显示截取数据到界面

showCurPageData2Table(cur_page_datas);

}

});

$('#page_div').pagination('select', 1);//转到第一页

}

作者:: 绰号:老哇的爪子claw of Eagle 偶像破坏者Iconoclast image-smasher

捕鸟王"Bird Catcher  kok  虔诚者Pious 宗教信仰捍卫者 Defender Of the Faith. 卡拉卡拉红斗篷 Caracalla red cloak 万兽之王

简称:: Emir Attilax Akbar 埃米尔 阿提拉克斯 阿克巴

全名::Emir Attilax Akbar bin Mahmud bin  attila bin Solomon bin adam Al Rapanui 埃米尔 阿提拉克斯 阿克巴 本 马哈茂德 本 阿提拉 本 所罗门 本亚当  阿尔 拉帕努伊

常用名:艾提拉(艾龙),  EMAIL:1466519819@qq.com

头衔:uke总部o2o负责人,全球网格化项目创始人,

uke交友协会会长  uke捕猎协会会长 Emir Uke部落首席大酋长,

uke宗教与文化融合事务部部长, uke宗教改革委员会副主席

uke制度与重大会议委员会委员长,uke保安部首席大队长,uke制度检查委员会副会长,

uke 首席cto   软件部门总监 技术部副总监  研发部门总监主管  产品部副经理 项目部副经理   uke科技研究院院长uke软件培训大师

uke波利尼西亚区大区连锁负责人 汤加王国区域负责人 uke克尔格伦群岛区连锁负责人,莱恩群岛区连锁负责人,uke布维岛和南乔治亚和南桑威奇群岛大区连锁负责人

Uke软件标准化协会理事长理事长 Uke 数据库与存储标准化协会副会长

uke终身教育学校副校长   Uke医院 与医学院方面的创始人

uec学院校长, uecip图像处理机器视觉专业系主任   uke文档检索专业系主任

Uke图像处理与机器视觉学院首席院长

Uke 户外运动协会理事长  度假村首席大村长   uke出版社编辑总编

转载请注明来源:attilax的专栏  ?http://www.cnblogs.com/attilax/

--Atiend  v8

Atitit easyui翻页组件与vue的集成解决方案attilax总结的更多相关文章

  1. Atitit.pagging  翻页功能解决方案专题 与 目录大纲 v3 r44.docx

    Atitit.pagging  翻页功能解决方案专题 与 目录大纲 v3 r44.docx 1.1. 翻页的重要意义1 1.2. Dep废弃文档   paip.js翻页分页pageing组件.txt1 ...

  2. 一款易用、高可定制的vue翻页组件

    一款易用.高可定制的vue翻页组件 在线体验:pages.cixi518.com 使用 npm i vo-pages --save vo-pages组件父元素必须设置固定高度并填写属性overflow ...

  3. 翻页组件page-flip调用问题

    翻页组件重新调用解决方案 翻页组件:page-flip import { PageFlip } from 'page-flip' pagefile() { //绘制翻页 this.pageFlip = ...

  4. Atitit 基于sql编程语言的oo面向对象大规模应用解决方案attilax总结

    Atitit 基于sql编程语言的oo面向对象大规模应用解决方案attilax总结 1. Sql语言应该得到更大的范围的应用,1 1.1. 在小型系统项目中,很适合存储过程写业务逻辑2 1.2. 大型 ...

  5. Atitit 翻页功能的解决方案与版本历史 v4 r49

    Atitit 翻页功能的解决方案与版本历史 v4 r49 1. 版本历史与分支版本,项目版本记录1 1.1. 主干版本历史1 1.2. 分支版本  项目版本记录.1 2. Easyui 的翻页组件2 ...

  6. vue翻页器,包括上一页,下一页,跳转

    翻页组件 -- 子组件<template> <div class="pager-wrapper" ref="pager"> <di ...

  7. element-ui table 的翻页记忆选中

    公司中台项目刚开始开发,用了vue+element,需要许多前置调研,table的翻译记忆选中就是其中之一. template: <el-table :ref="tableRef&qu ...

  8. 解决Hexo博客模板hexo-theme-next的翻页按钮不正常显示问题

    用Hexo搭了个Gitpage的博客,兴冲冲的发了11篇博文后发现翻页按钮不正常显示,显示为<i class="fa fa-angle-right"></i> ...

  9. vue案例 - vue-awesome-swiper实现h5滑动翻页效果

    说到h5的翻页,很定第一时间想到的是swiper.但是我当时想到的却是,vue里边怎么用swiper?! 中国有句古话叫:天塌下来有个高的顶着. 在前端圈里,总有前仆后继的仁人志士相继挥洒着热汗(这里 ...

随机推荐

  1. 6-5 巡逻机器人 uva1600

    一开始按照标准bfs来写  标记为二维数组 后来按照三维数组写过了    ps大部分bfs都不会是二维数组搞定!!! 其中有一个bug弄了半个小时... 一开始我是先判断!vis[x][y][v.c] ...

  2. 第一章 Python入门

    一. 语言 计算机语言:人和计算机之间沟通的语言计算机语言: 按照级别分类:(越高级月进阶人类) 机器语言: 汇编语言: 助记符 ag. add 2 3 高级语言: c, PHP, java , .n ...

  3. QT学习之第一个程序

    QT学习之第一个程序 目录 手动创建主窗口 居中显示 添加窗口图标 显示提示文本 Message Box的应用 手动连接信号与槽 手动创建主窗口 窗口类型 QMainWindow: 可以包含菜单栏.工 ...

  4. HTML的lang属性的作用

    今天翻了一下<css权威指南>选择器章节,看到伪类选择器,也叫语言选择器:lang(language),顾名思义它会根据html设置的语言应用对应样式,如: *:lang(en){ col ...

  5. 进程描述和控制(os 笔记二)

    进程描述和控制 ​ 计算机最初的主要任务之一就是高效的自动化我们的工作,完成用户交付的任务.而这种任务在计算机中的表示就是一个个的进程.从上一篇文章中描述的计算机的发展历史我们能发现,无论是单道批处理 ...

  6. vim编辑器基本操作

    命令模式: 按(i)键进入编辑模式,将在光标前面插入: 按(I)键进入编辑模式,将在光标行首插入: 按(a)进入编辑模式,在光标后面插入: 按(A)键进入编辑模式,将在光标行末插入: 按(o)进入编辑 ...

  7. JAXB注解 @XmlRootElement 及XML文件解析详解

    @Retention(value=RUNTIME) @Target(value=TYPE) public @interface XmlRootElement @Inherited @Retention ...

  8. Egret 之 消除游戏 开发 PART 6 Egret elimination game development PART 6

    Egret 之 消除游戏 开发 PART 6 Egret elimination game development PART 6 作者:韩梦飞沙 Author:han_meng_fei_sha 邮箱: ...

  9. BZOJ.4298.[ONTAK2015]Bajtocja(Hash 启发式合并)

    题目链接 \(Description\) 给定\(d\)张无向图,每张图都有\(n\)个点.一开始,在任何一张图中都没有任何边. 接下来有\(m\)次操作,每次操作会给出\(a,b,k\),意为在第\ ...

  10. 20172302 《Java软件结构与数据结构》实验一:线性结构实验报告

    课程:<Java软件结构与数据结构> 班级: 1723 姓名: 侯泽洋 学号:20172302 实验教师:王志强老师 实验日期:2018年9月26日 必修/选修: 必修 实验内容 (1)链 ...