Javascript 使用MaterialUI网格指定：：after样式

我阅读并试图看看这是否也适用于我：

.grid::after {
  content: "";
  flex: auto;
}

但我不确定如何在MaterialUI中使用的JS样式中指定这一点：

const useStyles = makeStyles((theme) => ({
  root: {
    flexGrow: 1,
  },
  paper: {
    height: 140,
    width: 140,
  },
  control: {
    padding: theme.spacing(2),
  },
  fullName: {
    marginRight: '3px'
  }
}));

例如，如何将“后”添加到材质网格

 <Grid className={classes.root} container justify="space-around" spacing={2}>
   <CompanyList companies={companies} data-test-id="companyList" />
 </Grid>

---

您可以像下面这样使用：

const useStyles=makestylesTime=>{ 网格：{ //-一些风格 “&：：在”：{ //-某种风格 } }, };

---

您可以像下面这样使用：

const useStyles=makestylesTime=>{ 网格：{ //-一些风格 “&：：在”：{ //-某种风格 } }, }; 这是一项类似的任务

内容属性需要双引号

工作实例

const useStyles = makeStyles((theme) => ({
  root: {
    flexGrow: 1,
    "&::after": {
      content: '""',
      width: 40,
      height: 40,
      backgroundColor: "cyan",
      color: "white"
    }
  },
}));

export default function Material() {
  const classes = useStyles();

  return (
    <div>
      <h1>Material</h1>
      <Grid
        className={classes.root}
        container
        justify="space-around"
        spacing={2}
      >
        <CompanyList companies={companies} data-test-id="companyList" />
      </Grid>
    </div>
  );
}

这是一项类似的任务

内容属性需要双引号

工作实例

const useStyles = makeStyles((theme) => ({
  root: {
    flexGrow: 1,
    "&::after": {
      content: '""',
      width: 40,
      height: 40,
      backgroundColor: "cyan",
      color: "white"
    }
  },
}));

export default function Material() {
  const classes = useStyles();

  return (
    <div>
      <h1>Material</h1>
      <Grid
        className={classes.root}
        container
        justify="space-around"
        spacing={2}
      >
        <CompanyList companies={companies} data-test-id="companyList" />
      </Grid>
    </div>
  );
}