以下是正确语法的示例（
"& $addIcon"嵌套在中
&:hover）。
import * as React from "react";import { render } from "react-dom";import { Grid, makeStyles } from "@material-ui/core";import AddIcon from "@material-ui/icons/Add";const useStyles = makeStyles(theme => ({ outerDiv: { backgroundColor: theme.palette.grey[200], padding: theme.spacing(4), '&:hover': { cursor: 'pointer', backgroundColor: theme.palette.grey[100], "& $addIcon": { color: "purple" } } }, addIcon: (props: { dragActive: boolean }) => ({ height: 50, width: 50, color: theme.palette.grey[400], marginBottom: theme.spacing(2) })}));function App() { const classes = useStyles(); return ( <Grid container> <Grid item className={classes.outerDiv}> <AddIcon className={classes.addIcon} /> </Grid> </Grid> );}const rootElement = document.getElementById("root");render(<App />, rootElement);
