React: Render new row every 4th column

Question

I\'m using react and I want to render a new row every 4th column.

My code:

function Product(props) {
  const content = prop         


        

Answer 1

You can do something like this:

render() {

    function toChunkArray(myArray: any, chunkSize: any): any {
        var results = [];

        while (myArray.length) {
            results.push(myArray.splice(0, chunkSize));
        }

        return results;
    }

    let chunkedArraysOfColSize = toChunkArray(myList, 3);

    return (
        

            {
                chunkedArraysOfColSize.map( (colSizeArray, index) =>
                    

                        {colSizeArray.map((o, i) =>
                            
                        )}
                    
                )
            }
        
    );
}