如何在material-ui中将属性传递给组件，以便在ListItem标记内进行路由？

const routes = [
  { path: '/', name: 'Home', component: Home },
  { path: '/about', name: 'About', component: About },
  { path: '/contact', name: 'Contact', component: Contact },
];

import { Link } from 'react-router-dom';
import { ListItem, ListItemText } from '@material-ui/core';

...

{routes.map((route) => (
  <ListItem button component={Link} to={route.path} key={route.path}>
    <ListItemText primary={route.name} />
  </ListItem>
))}

import { BrowserRouter as Router, Switch, Route } from 'react-router-dom';

...

<Router>
  <Switch>
    {routes.map((route) => (
      <Route exact path={route.path} component={route.component} key={route.path} />
    ))}
  </Switch>
</Router>