Stas Kurilin Stas Kurilin - 2 months ago 17
React JSX Question

Composing material table from custom rows

I want to wrap each of my rows in table with dedicated component so that it would have structure like

<TableBody>
<MyRow/>
<MyRow/>
</TableBody>


instead of

<TableBody>
<TableRow/>
<TableRow/>
</TableBody>


However, after doing it selection checkbox disappears.

https://jsfiddle.net/uLed8p5u/

Any advices how that could be fixed?

Answer
var MyRow = React.createClass({
    render: function () {
        return <TableRow {...this.props}>
        {this.props.children[0]}
        <TableRowColumn>2</TableRowColumn>
        <TableRowColumn>Randal White</TableRowColumn>
        <TableRowColumn>Unemployed</TableRowColumn>
      </TableRow>
      }
});

Just needs to have the props re-applied to the child elements in the same way that the TableBody component does.