Expand subcomponent rows by default with react-table
In order to expand all rows from the beginning, you can use the props defaultExpanded
in which you give all the rows index you want to expand. (In this case, all of them), like this :
render() {
// Set all the rows index to true
const defaultExpandedRows = data.map((element, index) => {return {index: true}});
return (
<div>
<ReactTable
data={data}
// Use it here
defaultExpanded={defaultExpandedRows}
columns={columns}
defaultPageSize={10}
className="-striped -highlight"
SubComponent={subComponent}
/>
</div>
);
}
For more information, you can look here.