How to add a link to a list in material-ui 1.0?

Question

The following clutter with onClick animations (ListItem turns red):

<List>
  <a href="https://www.google.com">
    <ListItem button>
       <ListItemText primary="Google" />
     </ListItem>
   </a>
 </List>

When adding a link inside a ListItem, it only does the transition work if ListItemText is clicked, which I don't want. What is the correct way to add a link?

Answer 1

The easiest way to do this is to make the link a ListItemlink using componentprop:

<List>
  <ListItem button component="a" href="https://www.google.com">
    <ListItemText primary="Google" />
  </ListItem>
</List>

Thus, it ListItemwill be a tag attached, tied to the right place, but still get the appropriate style so that visual changes do not appear.

component prop . , href prop , ​​ :

.

Answer 2

"response-router-dom"

import { Link } from "react-router-dom";
<ListItem button component={Link} to="/design">

: docs