阵营附加在每5个项目使用循环

Question

DIV我有这个道具循环，推动和显示30项

var newArr = []; 
for (var key in this.props.data) { 

    // for (var i = start; i < start + 5; i++) { 
    //  if (i > array.length) return; 

    //  $("#output").append(array[k]); 
    // } 

    newArr.push(<div><Dates key={key} /></div>); 
} 

我需要显示在列。这5个项目，以便把它包5个项目中的每个div都喜欢jQuery代码评论出了可能吗？

Answer 1

也许不是最好的算法在那里，但我觉得你想要做这样的事情：

var dates = []; 
var rows = []; 
for (var key in this.props.data) { 
    if (this.props.data.hasOwnProperty(prop)) { 
    dates.push(<Dates key={key} />); 

    if(dates.length === 5) { 
     rows.push(
     <div> 
      {dates} 
     </div> 
    ); 

     dates = []; 
    } 
    } 
} 

// final step 
rows.push(
    <div> 
    {dates} 
    </div> 
); 

Answer 2

上述答案的工作，所以这真的只是代码高尔夫，但这里是我的裂纹它。使用forEach可以让您不用担心索引计算错误，代码会占用最后一行非完整行。

var newArr = [], row=[], rowLength=5; 
this.props.data.forEach((item, index) => { 
    row.push(item); 
    if ((row.length === rowLength) || index === this.props.data.length - 1) { 
    newArr.push(<div>{row}</div>); 
    row = []; 
    } 
})