javascript - Can anyone give me some guidance on how to implement list paging? ? ? Beg on your knees

Question

The code is written in the background. . . Paging has been implemented, but

I don’t know how to start with this part. Currently, this part is written by myself using ul>li on the page, and the data is dead;
Can a god give me some guidance? ? Thanks

Answer 1

Are you saying that the hard-coded data will be replaced by the rendering of the background paging data?

If this is the case, please traverse the paged array and write it into the DOM. It should be ok

---

According to your needs

// 新建长度为 95 的数组并初始化为全0
var arr = new Array(95).fill(0); 

// 每页 20 个 
var p = 20; 
// 结果 
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; 
    }
}, []); 

Hint

First look at the reduce of the array

is like this:
acc is accumulation accumulation
cur is current current
idx is index is serial number
its is itself Refers to arr

All it means is:
Recursively traverse the array arr, and pass acc cur idx its into the first parameter of reduce.

Among them The return value of each function execution will be used as the next acc value.

Thus:
If the length of acc reaches p-1 or idx reaches the last element, then
push cur to acc and then push acc to res and return the empty array as acc for the next function execution

Otherwise, push cur into acc and return acc as the acc for the next loop

Link

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

Answer 2

It is better to find a paging plug-in to handle pagination. Paging processing plug-ins for tables include bootstrap table, etc. There will also be corresponding paging plug-ins for other scenarios. Just go to Baidu and check it out