jq easyui数据网络的分页过程

Rainie 发布于2019-08-21 10:53 / 2097人阅读

摘要：在涉及到组件的分页功能时，遇到了一点问题。由于数据较多，这边不予展示。返回的数据必须是符合要求的数据，格式如下必须带有属性，属性值为总共的数据条数，是这一页的数据内容，以数组对象的形式返回。

第一次写技术方面的文章，有点忐忑，总怕自己讲的不对误导别人。但是万事总有个开头，有不足错误之处，请各位读者老爷指出。

言归正传，最近刚进新公司，上头要求我先熟悉熟悉easyui这个组件库。在涉及到datagrid组件的分页功能时，遇到了一点问题。

我们在处理分页时，通常有两种方式，前端分页和后台分页。前端分页会将后台数据一次性全部查询返回，然后在前端存储处理。这样的方式缺点很明显，如果数据量非常大，存储在前端显然是一种非常不明智的方式，对于性能有明显影响。

那我们来看看easyui处理分页的方式。

以上是页面上的代码，当设置pagination属性为true时，easyui会自动加上一个分页器。这个分页器，当页面加载或者是用户改变当前页面时，easyui会以ajax的方式发送给后台两个参数:page和row。page是指当前页码，row指一页显示多少条信息。

我们这边用nodejs搭建一个简单的web服务器，来看看后台是怎么进行分页的。定义一个json对象，模拟一下数据库里的数据。由于数据较多，这边不予展示。当easyui发送请求过来时，我们先获取它带的参数，这两个参数是以query方式带过来的。

var page = req.query.page;//page当前页
var row = req.query.rows;//页面最多几条
var start = (page-1)*row;//查询起始位置
var end = page*row-1;//查询结束位置

根据拿到的page和row两个值确定该页面返回的数据。返回的数据必须是符合easyui要求的json数据，格式如下:

{"total":length,"rows":returnArray}

必须带有total属性，属性值为总共的数据条数，returnArray是这一页的数据内容，以数组对象的形式返回。返回前端后，easyui会自动帮你把数据填充。这样一来，我们就理解了这个分页的原理。

但是问题来了，easyui每一次改变当前页码，都会向后台发起一次请求。我们知道，在web项目中，大量的http请求会影响性能，easyui如此频繁的请求操作，是不是也值得商榷呢？这也导致了大量的重复对数据库的查询操作，因为我们要根据页码来获取不同区间的数据集。

不知道大家有没有什么好的方法呢？欢迎指正。

云服务器 GPU云服务器存储过程的分页 html的分页 jstl的分页 js的分页代码

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/86347.html

jq easyui数据网络的分页过程

摘要：在涉及到组件的分页功能时，遇到了一点问题。由于数据较多，这边不予展示。返回的数据必须是符合要求的数据，格式如下必须带有属性，属性值为总共的数据条数，是这一页的数据内容，以数组对象的形式返回。第一次写技术方面的文章，有点忐忑，总怕自己讲的不对误导别人。但是万事总有个开头，有不足错误之处，请各位读者老爷指出。言归正传，最近刚进新公司，上头要求我先熟悉熟悉easyui这个组件库。在涉及到...

array_huang 2019-08-01 15:21 评论0 收藏0
常用的CSS框架

摘要：常用的框架之前在写自己的个人网站的时候，由于自己前端不是特别好，于是就去找相关的框架来搭建页面了。找到以下这么一篇文章列出了很多常用的框架本篇主要是记录我用过的框架，并把之前写过的笔记进行整合一下。常用的CSS框架之前在写自己的个人网站的时候，由于自己Web前端不是特别好，于是就去找相关的CSS框架来搭建页面了。找到以下这么一篇文章(列出了很多常用的CSS框架)： http://...

Alfred 2019-08-30 14:04 评论0 收藏0
常用的CSS框架

摘要：常用的框架之前在写自己的个人网站的时候，由于自己前端不是特别好，于是就去找相关的框架来搭建页面了。找到以下这么一篇文章列出了很多常用的框架本篇主要是记录我用过的框架，并把之前写过的笔记进行整合一下。常用的CSS框架之前在写自己的个人网站的时候，由于自己Web前端不是特别好，于是就去找相关的CSS框架来搭建页面了。找到以下这么一篇文章(列出了很多常用的CSS框架)： http://...

kk_miles 2019-08-22 15:02 评论0 收藏0
懒加载实现的分页&&网站footer自适应

摘要：最近在做手机端，发现下拉刷新和上拉加载的控件很少而且自我感觉不好用，比如之类然后自己写了个懒加载的，也很简单，最基础的代码不喜勿喷，但蛮实用的手机端懒加载分页用之前先引用下这里的表示距离底部像素触发，可自行调节第页这里放你的分页代码这是刷最近在做手机端，发现下拉刷新和上拉加载的jq控件很少而且自我感觉不好用，比如iscroll之类…… 然后自己写了个懒加载的，也很简单，最基础的代码【...

neu 2019-08-20 13:45 评论0 收藏0