javascript - 各路大神,誰可以指導(dǎo)一下,列表分頁怎么實現(xiàn)啊???跪求
問題描述
后臺寫好了代碼。。。分頁是實現(xiàn)了,但是這一塊不知道如何下手,目前這一塊是自己在頁面用ul>li寫的,數(shù)據(jù)也是死的;大神可以指導(dǎo)一下嗎??謝謝
問題解答
回答1:你是說把后臺分頁分好的數(shù)據(jù)渲染替換掉寫死的數(shù)據(jù)嗎?
如果是這樣 請遍歷分頁分好的數(shù)組,然后寫入DOM里面 應(yīng)該就ok
跟據(jù)你的需求
// 新建長度為 95 的數(shù)組并初始化為全0var arr = new Array(95).fill(0);
// 每頁 20 個 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 是序號its 是 itself 指代 arr
全部的意思是: 遞歸的遍歷數(shù)組arr,把 acc cur idx its 傳進 reduce 的第一個參數(shù)。
其中 每一次函數(shù)執(zhí)行的返回值將作為下一次 acc 的值來使用。
因而: 如果 acc的長度達到了 p-1 或者 idx 到了最后一個元素 則把 cur push 到 acc 然后把 acc push 到 res 然后返回 空數(shù)組作為下次函數(shù)執(zhí)行的 acc
否則 把 cur push進 acc 然后返回acc 作為下次循環(huán)用的 acc
Linkreduce https://developer.mozilla.org...
回答2:分頁最好還是找一個分頁的插件來處理會比較好,表格的分頁處理插件有bootstrap table等,其他的場景也會有相應(yīng)的分頁插件,你去百度一下就好了
