亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

jq easyui數(shù)據(jù)網(wǎng)絡(luò)的分頁(yè)過(guò)程

array_huang / 3408人閱讀

摘要:在涉及到組件的分頁(yè)功能時(shí),遇到了一點(diǎn)問題。由于數(shù)據(jù)較多,這邊不予展示。返回的數(shù)據(jù)必須是符合要求的數(shù)據(jù),格式如下必須帶有屬性,屬性值為總共的數(shù)據(jù)條數(shù),是這一頁(yè)的數(shù)據(jù)內(nèi)容,以數(shù)組對(duì)象的形式返回。

第一次寫技術(shù)方面的文章,有點(diǎn)忐忑,總怕自己講的不對(duì)誤導(dǎo)別人。但是萬(wàn)事總有個(gè)開頭,有不足錯(cuò)誤之處,請(qǐng)各位讀者老爺指出。

言歸正傳,最近剛進(jìn)新公司,上頭要求我先熟悉熟悉easyui這個(gè)組件庫(kù)。在涉及到datagrid組件的分頁(yè)功能時(shí),遇到了一點(diǎn)問題。

我們?cè)谔幚矸猪?yè)時(shí),通常有兩種方式,前端分頁(yè)和后臺(tái)分頁(yè)。前端分頁(yè)會(huì)將后臺(tái)數(shù)據(jù)一次性全部查詢返回,然后在前端存儲(chǔ)處理。這樣的方式缺點(diǎn)很明顯,如果數(shù)據(jù)量非常大,存儲(chǔ)在前端顯然是一種非常不明智的方式,對(duì)于性能有明顯影響。

那我們來(lái)看看easyui處理分頁(yè)的方式。

  
姓名 學(xué)號(hào) 學(xué)校 專業(yè) 操作

以上是頁(yè)面上的代碼,當(dāng)設(shè)置pagination屬性為true時(shí),easyui會(huì)自動(dòng)加上一個(gè)分頁(yè)器。這個(gè)分頁(yè)器,當(dāng)頁(yè)面加載或者是用戶改變當(dāng)前頁(yè)面時(shí),easyui會(huì)以ajax的方式發(fā)送給后臺(tái)兩個(gè)參數(shù):page和row。page是指當(dāng)前頁(yè)碼,row指一頁(yè)顯示多少條信息。

我們這邊用nodejs搭建一個(gè)簡(jiǎn)單的web服務(wù)器,來(lái)看看后臺(tái)是怎么進(jìn)行分頁(yè)的。定義一個(gè)json對(duì)象,模擬一下數(shù)據(jù)庫(kù)里的數(shù)據(jù)。由于數(shù)據(jù)較多,這邊不予展示。當(dāng)easyui發(fā)送請(qǐng)求過(guò)來(lái)時(shí),我們先獲取它帶的參數(shù),這兩個(gè)參數(shù)是以query方式帶過(guò)來(lái)的。

var page = req.query.page;//page當(dāng)前頁(yè)
var row = req.query.rows;//頁(yè)面最多幾條
var start = (page-1)*row;//查詢起始位置
var end = page*row-1;//查詢結(jié)束位置

根據(jù)拿到的page和row兩個(gè)值確定該頁(yè)面返回的數(shù)據(jù)。返回的數(shù)據(jù)必須是符合easyui要求的json數(shù)據(jù),格式如下:

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

必須帶有total屬性,屬性值為總共的數(shù)據(jù)條數(shù),returnArray是這一頁(yè)的數(shù)據(jù)內(nèi)容,以數(shù)組對(duì)象的形式返回。返回前端后,easyui會(huì)自動(dòng)幫你把數(shù)據(jù)填充。這樣一來(lái),我們就理解了這個(gè)分頁(yè)的原理。

但是問題來(lái)了,easyui每一次改變當(dāng)前頁(yè)碼,都會(huì)向后臺(tái)發(fā)起一次請(qǐng)求。我們知道,在web項(xiàng)目中,大量的http請(qǐng)求會(huì)影響性能,easyui如此頻繁的請(qǐng)求操作,是不是也值得商榷呢?這也導(dǎo)致了大量的重復(fù)對(duì)數(shù)據(jù)庫(kù)的查詢操作,因?yàn)槲覀円鶕?jù)頁(yè)碼來(lái)獲取不同區(qū)間的數(shù)據(jù)集。

不知道大家有沒有什么好的方法呢?歡迎指正。

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://www.ezyhdfw.cn/yun/49858.html

相關(guān)文章

  • jq easyui數(shù)據(jù)網(wǎng)絡(luò)分頁(yè)過(guò)程

    摘要:在涉及到組件的分頁(yè)功能時(shí),遇到了一點(diǎn)問題。由于數(shù)據(jù)較多,這邊不予展示。返回的數(shù)據(jù)必須是符合要求的數(shù)據(jù),格式如下必須帶有屬性,屬性值為總共的數(shù)據(jù)條數(shù),是這一頁(yè)的數(shù)據(jù)內(nèi)容,以數(shù)組對(duì)象的形式返回。 第一次寫技術(shù)方面的文章,有點(diǎn)忐忑,總怕自己講的不對(duì)誤導(dǎo)別人。但是萬(wàn)事總有個(gè)開頭,有不足錯(cuò)誤之處,請(qǐng)各位讀者老爺指出。 言歸正傳,最近剛進(jìn)新公司,上頭要求我先熟悉熟悉easyui這個(gè)組件庫(kù)。在涉及到...

    Rainie 評(píng)論0 收藏0
  • 常用的CSS框架

    摘要:常用的框架之前在寫自己的個(gè)人網(wǎng)站的時(shí)候,由于自己前端不是特別好,于是就去找相關(guān)的框架來(lái)搭建頁(yè)面了。找到以下這么一篇文章列出了很多常用的框架本篇主要是記錄我用過(guò)的框架,并把之前寫過(guò)的筆記進(jìn)行整合一下。 常用的CSS框架 之前在寫自己的個(gè)人網(wǎng)站的時(shí)候,由于自己Web前端不是特別好,于是就去找相關(guān)的CSS框架來(lái)搭建頁(yè)面了。 找到以下這么一篇文章(列出了很多常用的CSS框架): http://...

    Alfred 評(píng)論0 收藏0
  • 常用的CSS框架

    摘要:常用的框架之前在寫自己的個(gè)人網(wǎng)站的時(shí)候,由于自己前端不是特別好,于是就去找相關(guān)的框架來(lái)搭建頁(yè)面了。找到以下這么一篇文章列出了很多常用的框架本篇主要是記錄我用過(guò)的框架,并把之前寫過(guò)的筆記進(jìn)行整合一下。 常用的CSS框架 之前在寫自己的個(gè)人網(wǎng)站的時(shí)候,由于自己Web前端不是特別好,于是就去找相關(guān)的CSS框架來(lái)搭建頁(yè)面了。 找到以下這么一篇文章(列出了很多常用的CSS框架): http://...

    kk_miles 評(píng)論0 收藏0
  • 懶加載實(shí)現(xiàn)分頁(yè)&&網(wǎng)站footer自適應(yīng)

    摘要:最近在做手機(jī)端,發(fā)現(xiàn)下拉刷新和上拉加載的控件很少而且自我感覺不好用,比如之類然后自己寫了個(gè)懶加載的,也很簡(jiǎn)單,最基礎(chǔ)的代碼不喜勿噴,但蠻實(shí)用的手機(jī)端懶加載分頁(yè)用之前先引用下這里的表示距離底部像素觸發(fā),可自行調(diào)節(jié)第頁(yè)這里放你的分頁(yè)代碼這是刷 最近在做手機(jī)端,發(fā)現(xiàn)下拉刷新和上拉加載的jq控件很少而且自我感覺不好用,比如iscroll之類…… 然后自己寫了個(gè)懶加載的,也很簡(jiǎn)單,最基礎(chǔ)的代碼【...

    neu 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<