使用ivx實現(xiàn)分頁獲取數(shù)據(jù)的經(jīng)驗總結

在實際案例中我們經(jīng)常需要展示一些數(shù)據(jù)螟碎,而這些數(shù)據(jù)都是存放在后臺的數(shù)據(jù)庫之中的而且可能數(shù)量龐大,在前臺的界面中一下子全都展示出來肯定是不現(xiàn)實的芥玉,另外一次性讓后臺傳輸如此多的數(shù)據(jù)到前臺也會有很大的延遲曙搬,使用戶體驗較差好港。因此辞色,我們就需要采取一種分頁的方式來少量多次的獲取數(shù)據(jù)骨宠,這樣用戶每次操作之后都能很快得到反饋,同時前臺也不用存放很多數(shù)據(jù)造成案例卡頓相满,今天就來說說如何實現(xiàn)這種分頁效果层亿。


1.組件結構

Demo中的結構比較簡單,頁面下放置了一個列作為案例主體雳灵,列內(nèi)添加了一個分頁組件棕所,還有一個for容器用于循環(huán)創(chuàng)建每頁顯示的圖片闸盔,而循環(huán)創(chuàng)建的數(shù)據(jù)來源就是對象數(shù)組分頁數(shù)據(jù)悯辙。


2.分頁組件

分頁組件是ivx中的一個拓展組件,主要應用場景就是分頁顯示數(shù)據(jù)啦迎吵,當然我們也可以使用各個基礎功能去做一個自定義樣式的分頁模塊躲撰。不過今天就只介紹一下分頁組件的屬性和用法。


數(shù)據(jù)總條數(shù)和每頁數(shù)據(jù)條數(shù)可以算出分頁組件一個有多少個分頁击费,demo中這里已經(jīng)設置了一共10條數(shù)據(jù)并且每頁顯示3張圖片拢蛋。顯示按鈕數(shù)量對應的是中間有幾個頁號按鈕。


當顯示的是第一頁時蔫巩,首頁和上一頁的按鈕會隱藏谆棱,同理,在顯示最后一頁時下一頁和尾頁也會隱藏圆仔。


如果開啟精簡模式首頁贡翘,尾頁雪隧,上一頁和下一頁的按鈕就都會隱藏掉。


3實現(xiàn)分頁獲取數(shù)據(jù)的邏輯

首先是前臺初始化的時候,先調(diào)用了輸出分頁數(shù)據(jù)服務再芋,并且調(diào)用的時候傳給服務的page參數(shù)等于1。而服務中讓數(shù)據(jù)庫輸出的行數(shù)是從(page-1)*3+1到page*3,代入page=1,經(jīng)過計算即1到3行嫌松。



所以,打開案例后直接呈現(xiàn)效果的如下圖所示奕污。


這里也說一下這兩個動作吧萎羔,他們的作用就是在服務返回數(shù)據(jù)庫的輸出結果前顯示一個這樣的加載框,當前臺拿到服務的返回結果就讓加載框隱藏碳默。如果想讓案例更完美這樣的小細節(jié)也是必不可少的外驱。



然后就是案例運行中我們選擇了某一個頁面后,依舊是調(diào)用輸出分頁數(shù)據(jù)服務腻窒,并設置page參數(shù)等于分頁組件的“當前頁碼”昵宇,這個變量是在分頁組件的“當前頁改變”事件下拋出的。儿子。比如我們點擊了頁號2瓦哎,“當前頁碼”等于2,即服務中page=2柔逼,數(shù)據(jù)庫依舊按公式輸出(page-1)*3+1到page*3行蒋譬,代入計算可得是第4到第6行,按照我們對數(shù)據(jù)庫三行算一頁的劃分這正好是第二頁的數(shù)據(jù)愉适。我們把這三行數(shù)據(jù)傳給前臺的分頁數(shù)據(jù)對象數(shù)組犯助,for循環(huán)容器就按照這三行數(shù)據(jù)創(chuàng)建出三個圖片組件顯示出來。



4.動態(tài)頁號

在這個demo中分頁組件已經(jīng)設置好了一共10條數(shù)據(jù)维咸,然后每頁數(shù)據(jù)條數(shù)為3剂买,則一共會有4個分頁,但是在實際案例中數(shù)據(jù)庫中的數(shù)據(jù)可能會隨著案例運行增加或者減少癌蓖,我們很難預先知道實際的數(shù)據(jù)總條數(shù)是多少瞬哼。另外,雖然服務中有統(tǒng)計數(shù)據(jù)庫數(shù)目的功能租副,但是數(shù)據(jù)量龐大的話我們也不可能每一次都去統(tǒng)計數(shù)據(jù)庫的數(shù)據(jù)總量坐慰,這是很耗費時間和設備資源的。所以下面就來說說如何實現(xiàn)動態(tài)頁號用僧。


當前结胀,列表數(shù)據(jù)數(shù)據(jù)庫中有16條數(shù)據(jù),這里不要看最后一條數(shù)據(jù)的數(shù)據(jù)ID是16就判定有16條數(shù)據(jù)责循,每條數(shù)據(jù)ID都是唯一的糟港,你把數(shù)據(jù)ID為1的數(shù)據(jù)刪除再添加一條新的數(shù)據(jù),新的數(shù)據(jù)的ID會是2沼死,所以實際數(shù)目其實小于等于最后一行數(shù)據(jù)的ID着逐。


在后臺再添加一個數(shù)據(jù)庫并給它添加一個字段數(shù)據(jù)總量,然后在第一行數(shù)據(jù)的該字段下輸入16,點擊保存耸别。


在后臺添加一個對象數(shù)組和數(shù)值變量健芭,先將分頁數(shù)據(jù)輸出后保存到對象數(shù)組中,然后獲取到數(shù)據(jù)庫中存放的數(shù)據(jù)總量秀姐,最后一起作為服務的返回參數(shù)慈迈。


找到前臺調(diào)用輸出分頁數(shù)據(jù)服務的兩個地方,在回調(diào)里將分頁組件的數(shù)據(jù)總量屬性的值設置為服務返回的結果省有。



最后要保證的就是數(shù)據(jù)總量數(shù)據(jù)庫中存放的值一直是等于列表數(shù)據(jù)中的數(shù)據(jù)總條數(shù)的痒留。如果列表數(shù)據(jù)數(shù)據(jù)庫中的數(shù)據(jù)條數(shù)是變化的,那么就會有提交數(shù)據(jù)和刪除數(shù)據(jù)的兩個服務,蠢沿。在提交服務中伸头,提交后我們就要將數(shù)據(jù)總量數(shù)據(jù)庫中的數(shù)據(jù)總量加1,在刪除服務中舷蟀,刪除數(shù)據(jù)后我們就將其減1恤磷,也就是加(-1)。(總之就是所有對列表數(shù)據(jù)有增刪時都要知會數(shù)據(jù)總量數(shù)據(jù)庫一聲兒啦)



總結

分頁獲取數(shù)據(jù)實現(xiàn)的難點一個在于動態(tài)野宜,這取決于案例中各部分邏輯的計算公式的設計扫步,一個在于對邊界的處理,必須考慮到各種情況匈子。這要求我們在制作案例時必須要邏輯縝密河胎,考慮全面,只有開發(fā)者把案例使用的全部狀況都考慮清楚才能確保用戶在使用時不會出現(xiàn)各種“意料之外的狀況”虎敦,這一直(還將永遠游岳?)都是開發(fā)者們所努力的方向吧。

?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末原茅,一起剝皮案震驚了整個濱河市吭历,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌擂橘,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,042評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件摩骨,死亡現(xiàn)場離奇詭異通贞,居然都是意外死亡,警方通過查閱死者的電腦和手機恼五,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,996評論 2 384
  • 文/潘曉璐 我一進店門昌罩,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人灾馒,你說我怎么就攤上這事茎用。” “怎么了?”我有些...
    開封第一講書人閱讀 156,674評論 0 345
  • 文/不壞的土叔 我叫張陵轨功,是天一觀的道長旭斥。 經(jīng)常有香客問我,道長古涧,這世上最難降的妖魔是什么垂券? 我笑而不...
    開封第一講書人閱讀 56,340評論 1 283
  • 正文 為了忘掉前任,我火速辦了婚禮羡滑,結果婚禮上菇爪,老公的妹妹穿的比我還像新娘。我一直安慰自己柒昏,他們只是感情好凳宙,可當我...
    茶點故事閱讀 65,404評論 5 384
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著职祷,像睡著了一般近速。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上堪旧,一...
    開封第一講書人閱讀 49,749評論 1 289
  • 那天削葱,我揣著相機與錄音,去河邊找鬼淳梦。 笑死析砸,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的爆袍。 我是一名探鬼主播首繁,決...
    沈念sama閱讀 38,902評論 3 405
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼陨囊!你這毒婦竟也來了弦疮?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 37,662評論 0 266
  • 序言:老撾萬榮一對情侶失蹤蜘醋,失蹤者是張志新(化名)和其女友劉穎胁塞,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體压语,經(jīng)...
    沈念sama閱讀 44,110評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡啸罢,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,451評論 2 325
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了胎食。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片扰才。...
    茶點故事閱讀 38,577評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖厕怜,靈堂內(nèi)的尸體忽然破棺而出衩匣,到底是詐尸還是另有隱情蕾总,我是刑警寧澤,帶...
    沈念sama閱讀 34,258評論 4 328
  • 正文 年R本政府宣布琅捏,位于F島的核電站生百,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏午绳。R本人自食惡果不足惜置侍,卻給世界環(huán)境...
    茶點故事閱讀 39,848評論 3 312
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望拦焚。 院中可真熱鬧蜡坊,春花似錦、人聲如沸赎败。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,726評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽僵刮。三九已至据忘,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間搞糕,已是汗流浹背勇吊。 一陣腳步聲響...
    開封第一講書人閱讀 31,952評論 1 264
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留窍仰,地道東北人汉规。 一個月前我還...
    沈念sama閱讀 46,271評論 2 360
  • 正文 我出身青樓,卻偏偏與公主長得像驹吮,于是被迫代替她去往敵國和親针史。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 43,452評論 2 348

推薦閱讀更多精彩內(nèi)容