sanity项目中如何为数组每4个对象循环设置card尺寸属性？

实现方案 #

你需要用取模运算符%实现序列循环匹配，无需按4个为一组拆分遍历，逻辑更简洁且适配任意长度的帖子数组。

提前定义尺寸序列数组，遍历帖子时用当前元素的索引对序列长度取余，即可自动循环匹配对应尺寸：

let items = [];
// 尺寸序列，后续需要调整尺寸顺序、新增/减少尺寸类型直接修改这个数组即可
const sizeList = ['s', 'm', 'l', 'xl'];

client.fetch(query).then((posts) => {
  posts.forEach((post, index) => {
    // 索引对序列长度取模，实现循环分配尺寸
    post.size = sizeList[index % sizeList.length];
    items.push(post);
  });
});

原代码问题说明 #

1. 循环步长设置为4，仅会处理索引为0、4、8...的元素，跳过了其余所有帖子
2. 对同一个索引的元素重复赋值4次size属性，最终仅会保留最后一次赋值的xl，完全不符合预期效果

内容的提问来源于stack exchange，提问作者j roc