Swiper分页——js一维数组转二维数组

使用Swiper展示数据时,往往需要进行分页, 每页根据需求放一定数量的item。

如我们想分多页展示学校师资,每页展示n个教师。

我们获取到的教师列表数据是一维的。如果转成二维数组,就很容易通过两层嵌套循环实现展示(如v-for)。

其中第一层循环负责生成多个页面 (swiper的每一页也就是一个swiper-slide) 。

第二层循环责负责生成页面中的多个教师(可能有1~n个)。

核心就是一维数组转二维数组,代码实现如下:

第一个参数是一维的数组,第二个参数是每页要展示的item个数

function arrTo2d(arr, size) {
    let arr2d=[];
    for(let i=0;i<arr.length;i=i+size){
        arr2d.push(arr.slice(i,i+size));
    }
    return arr2d;
}

console.log(arrTo2d([1,2,3,4,5,6,7,8,9], 4))

输出结果: [ [ 1, 2, 3, 4 ], [ 5, 6, 7, 8 ], [ 9 ] ]

猜你喜欢

转载自www.cnblogs.com/flamestudio/p/12150945.html