Javascript 在react应用程序中渲染DIV

你好。任务：

我从服务器获得一个包含帖子的数组。并退回：

{ this.state.articles.map((article) => {
return ( <div className={css(styles.feed_row)}>
  <div key={article.id} className={ css(boxes.art_box) }>
    <span className={css(boxes.cover)}>
      <img  src={article.art_cover} alt="" width={350}/>
    </span>
  </div>
</div> )
}

{this.state.articles.map（（article）=>{
报税表（
)
}

在出去的路上，我会得到一个有很多帖子的div

但是如何限制每个提要行，只有两个元素，或者在达到最大宽度后，自动创建一个新的。提要行并继续向其中添加帖子

我正试图得到这样的东西：

---

以下是如何将一维数组转换为所需的二维数组：

函数articleRows（articles，max，maxWidth）{
var行=[]；
var currentRow=[]；
const fits=a=>currentRow.reduce（（acc，curr）=>acc+curr.width，0）+a.width{
if（currentRow.lengtha.width））；
log（rows.map（row=>row.map（a=>a.width.join（“，”））；

您可以插入换行符（有点复杂），或将

s设置为

显示：内联块；

，以便它们彼此相邻，只要有足够的空间，然后环绕。我不需要样式，而是一个渲染函数。帖子的数量可能会有所不同。您是否询问如何每行有多个div？每个父级的最大宽度是750，子级的最大宽度可能不同。最宽的也是750（如何放置每行不超过两个）是的，它似乎有效。但仍然有一个问题。您最初设置了宽度。在我看来，样式是从帖子的类型开始的，并且以百分比表示。怎么办？