Dynamically generated columns

Do you know of a way to dynamically generate columns? I have something like this in mind (inside the render method):

const columns = ["name", "description", "age"];
return (
    <BootstrapTable data={someData}>
        <TableHeaderColumn isKey dataField="id">id</TableHeaderColumn>
        {columns.map(column => 
            <TableHeaderColumn dataField={column}>{column}</TableHeaderColumn>
        )}
    </BootstrapTable>
)

This seems like it would be a very efficient way of producing tables when you don’t know the columns ahead of time. When I try to do this however, if receive this error:

react-bootstrap-table.min.js?3226:6 Uncaught TypeError: Cannot read property 'children' of undefined

This makes me think that react-bootstrap-table might not be implemented in such a way that it supports this. I just wanted to see your thoughts.

Thanks for an awesome tool!

[AllenFang]

HI, try following way:

return (
    <BootstrapTable data={someData} keyField='id'>
        {columns.map(column => 
            <TableHeaderColumn dataField={column}>{column}</TableHeaderColumn>
        )}
    </BootstrapTable>
)

[tylerjryan]

Ah I see. The problem is trying to create one column manually and the rest in the map. When all of them are created in the map, it works great. Thank you!