react.js every nth item add opening tag or closing tag

Question

I\'m having trouble with this logic since react/jsx does not allow for non closing tags to be added to an array/child component. For example with bootstrap css I want to add

Answer 1

I actually just used arrays and react handled fine the rendering.

render() {
    let rows = [],
        cols = []
    let index = 0
    const totalCols = 20;

    for (index; index < totalCols; index++) {
        cols.push(
)
        if ((index + 1) % 4 == 0) {
            rows.push(
                

                    {cols}
                
            )
            cols = []
        }
    }
    return (
        

            {rows}
        
    )
}