Reactjs在每第4个元素上都有<div>包装器

最好的选择是将文章数组构建为4个长度的数组。您可以使用lodash的方便的块方法进行此操作。

对文章进行分块后，可以在JSX中对其进行迭代，如下所示：

const sections = chunk(articles, 4);

return (
  

    {sections.map((articles, i) => (
      

        {articles.map(item => )}
      
    )}
  
);

编辑：如果您不想使用lodash，则可以使用reduce，效果很好：

function chunk(array, size) {
  return array.reduce((chunks, item, i) => {
    if (i % size === 0) {
      chunks.push([item]);
    } else {  
      chunks[chunks.length - 1].push(item);
    }
    return chunks;
  }, []);
}