問題描述

后臺(tái)寫好了代碼。。。分頁是實(shí)現(xiàn)了，但是這一塊不知道如何下手，目前這一塊是自己在頁面用ul>li寫的，數(shù)據(jù)也是死的；大神可以指導(dǎo)一下嗎？？謝謝

問題解答

你是說把后臺(tái)分頁分好的數(shù)據(jù)渲染替換掉寫死的數(shù)據(jù)嗎？

如果是這樣 請(qǐng)遍歷分頁分好的數(shù)組，然后寫入DOM里面 應(yīng)該就ok

跟據(jù)你的需求

// 新建長度為 95 的數(shù)組并初始化為全0var arr = new Array(95).fill(0);

// 每頁 20 個(gè) var p = 20; // 結(jié)果 var res = []; // Array.prototpye.reduce arr.reduce(function(acc, cur, idx, its){ if (acc.length === p-1 || idx+1 === its.length) {acc.push(cur); res.push(acc);return []; } else {acc.push(cur); return acc; }}, []);

先看看數(shù)組的 reduce 把

是這樣： acc 是積累 accumulation cur 是當(dāng)前 current idx 是 index 是序號(hào)its 是 itself 指代 arr

全部的意思是： 遞歸的遍歷數(shù)組arr，把 acc cur idx its 傳進(jìn) reduce 的第一個(gè)參數(shù)。

其中 每一次函數(shù)執(zhí)行的返回值將作為下一次 acc 的值來使用。

因而： 如果 acc的長度達(dá)到了 p-1 或者 idx 到了最后一個(gè)元素 則把 cur push 到 acc 然后把 acc push 到 res 然后返回 空數(shù)組作為下次函數(shù)執(zhí)行的 acc

否則 把 cur push進(jìn) acc 然后返回acc 作為下次循環(huán)用的 acc

reduce https://developer.mozilla.org...

分頁最好還是找一個(gè)分頁的插件來處理會(huì)比較好，表格的分頁處理插件有bootstrap table等，其他的場(chǎng)景也會(huì)有相應(yīng)的分頁插件，你去百度一下就好了