title: How to add <Link> react-router per each Material-UI TableRow?
body: <blockquote>
    <p><strong>How to add link per TableRow in .map?</strong></p>
    
    <p>*my error is validateDOMNesting(...):  cannot appear as a child of "&lt; a >"
    im using react router react-router-dom</p>
    
    <p>how to add link in every loop of .map in Table TableRow?</p>
  </blockquote>
  
  <pre><code>   import React, { Fragment } from 'react'
  import { Paper } from 'material-ui'
  import Table from 'material-ui/Table';
  import TableBody from 'material-ui/Table/TableBody';
  import TableCell from 'material-ui/Table/TableCell';
  import TableHead from 'material-ui/Table/TableHead';
  import TableRow from 'material-ui/Table/TableRow';
  import { connect } from 'react-redux'
  // import { Edit, Delete } from '@material-ui/icons'
  import { withStyles } from 'material-ui/styles'
  import { BrowserRouter as Router, Route, Link } from "react-router-dom";
  const drawerWidth = 100;
  class Listofbond extends React.Component {
      render() {
          console.log(this.props);
          const { MainProps, classes } = this.props;
          return (
              &lt;Router&gt;
                  &lt;Paper&gt;
                      &lt;Table &gt;
                          &lt;TableHead&gt;
                              &lt;TableRow&gt;
                                  &lt;TableCell&gt;Bondame&lt;/TableCell&gt;
                              &lt;/TableRow&gt;
                          &lt;/TableHead&gt;
                          &lt;TableBody&gt;
                              {[1, 2, 3].map(n =&gt; {
                                  return (
                                      &lt;Link to={`/bond/${n}/`} key={n}&gt;
                                          &lt;TableRow&gt;
                                              &lt;TableCell component="th" scope="row"&gt;
                                                  {n}
                                              &lt;/TableCell&gt;
                                          &lt;/TableRow&gt;
                                      &lt;/Link&gt;
                                  );
                              })}
                          &lt;/TableBody&gt;
                      &lt;/Table&gt;
                  &lt;/Paper&gt;
              &lt;/Router&gt;
          )
      }
  
  }
  
  export default Listofbond;
  </code></pre>