Détail du package

@mfts2048/toothed-gear

mfts204831ISC0.2.7

Reduce your workload

toothed-gear, tools, workload

readme

齿轮 toothed gear

array/circularArray

介绍

应用场景:轮播图,无限滚动的场景下需要对不确定长度的数据进行分组,分组后的数据需要循环展示。

例如数据有 50 条,那么恰好可以分成 10 组,每组 5 条数据。

但是倘若数据有 51 条,那么就需要分成 11 组,前 10 组 5 条,最后一组 1 条。

这个时候产品的需求是,每组 5 条数据,不足 5 条的数据需要补全,补全的数据是从头开始的。

这个时候就需要用到 circularArray 了。

circularArray 会返回一个函数,这个函数接收两个参数,第一个参数是需要分组的数据,第二个参数是每组的长度。

类似一个小齿轮拨动大齿轮一样,你需要的一屏就是大齿轮,所有的数据则是小齿轮,你只需要关心你的一屏数据,而不需要关心数据的总长度。

使用需知

该函数不会改变原数组,只会读取对应的数组的索引值

案例

const array = [0, 1, 2, 3, 4, 5, 6, 7, 8];
// 将上面的数据处理成每页五条

数据就会被处理成这个样子

屏幕第一条数据 屏幕第二条数据 屏幕第三条数据 屏幕第四条数据 屏幕第五条数据
8 0 1 2 3
上翻 4 5 6 7 8
页面展示数据 0 1 2 3 4
下翻 5 6 7 8 0
1 2 3 4 5
6 7 8 0 1