How to make material-ui TableRowColumn span multiple columns

Question

It looks like an attribute html colspan. Some rows with different column numbers than others.

thank

Answer 1

Just add an attribute, for example:

<TableRowColumn colSpan={6}>

Answer 2

Just use the "colSpan" attribute for the element <TableCell>.

Example:

render() {
  return (
    <Table className={classes.table}>
      <TableBody>
        <TableRow>
          <TableCell>Data 1</TableCell>
          <TableCell>Data 2</TableCell>
        </TableRow>
        <TableRow>
          <TableCell colSpan={2}>Data Two Columns</TableCell>
        </TableRow>
      </TableBody>
    </Table>
  );
}