Im trying to create a list of links in a sidebar. The problems is that if I use
<ListItem button component='a' href="/persons">
The page reloads instead of going to the url like a Link
component would do.
<Link to='/persons' >
I wonder, how can I replace the Material UI listItem href behaviour with the react-router Link behaviour? This is the list im trying to fix:
// this breaks the design
<Link to='/persons' >
<ListItem button>
<ListItemIcon>
<Icon>people</Icon>
</ListItemIcon>
<ListItemText primary="Personas" />
</ListItem>
</Link>
// this reloads the page, i want to avoid
<ListItem button component='a' href="/persons">
<ListItemIcon>
<Icon>bar_chart</Icon>
</ListItemIcon>
<ListItemText primary="Reports" />
</ListItem>
This is how the link looks: