css - 材质UI ListItem在React.js中选择样式

我material-ui ListItem用来显示我的导航栏项目。

我编写了以下CSS代码，以显示选择每个项目时的样式。

<List>
  {routes.map(route => (
    <Link to={route.path} key={route.name} style={{ textDecoration: "none" }}>
      <ListItem button key={route.name} className={classes.listWrap}>
        <ListItemText primary={route.name} className={classes.listItemText} />
      </ListItem>
    </Link>
  ))}
</List>;

的CSS

listWrap: {
  "&:hover": {
    border: "1px solid #6c757d",
    color: "black"
  },
  textAlign: "center",
  "&:active": {
    background: "#6c757d",
    color: "black"
  }
}

当我选择一个ListItem样式不起作用

我们该如何解决？