Javascript 在TypeScript中使用createStyles验证内容

我有一个工具栏，我在其中使用的两个图标显示在左端。目前，我正在使用此样式设置方法：

const useStyles = makeStyles((theme: Theme) =>
  createStyles({
    root: {
      display: 'flex',
    },
    appBar: {
      width: `calc(100% - ${drawerWidth}px)`,
      marginLeft: drawerWidth,
    },
    drawer: {
      width: drawerWidth,
      flexShrink: 0,
    },
    drawerPaper: {
      width: drawerWidth,
    },

    panelheaderRight: {
      marginRight: 0,
      right: 0,
    },
    toolbar: theme.mixins.toolbar,
    content: {
      flexGrow: 1,
    // justifyContent: spaceBetween,
      backgroundColor: theme.palette.background.default,
      padding: theme.spacing(3),
    },
  }),
);

我希望图标出现在右端。如果我添加一个单独的css文件，它可以工作：

.toolbar-class{
    justify-content:space-between;
    }

但是我想在

createStyles

中使用它。createStyles中没有“间距”选项。这是我的组件的一部分的外观：

<AppBar position="fixed" className={classes.appBar}>
        <Toolbar className="toolbar-class">
          <Typography variant="h6" noWrap>
            Al
          </Typography>
          <div className="panelheaderRight">
            <NotificationsIcon />
            &nbsp;&nbsp;
            {/* <ExitToAppIcon onClick={() =>
            <ExitToAppIcon onClick={logout}></ExitToAppIcon>
          </div>
        </Toolbar>
      </AppBar>

艾尔
{/* 

是否有任何方法可以使用

createStyles

将图标向左移动，而无需添加单独的css文件？

一些注意事项：

• 将

  justify content

  更改为

  justify content

  ，并将值设置为字符串

• 对于

  makeStyles

那篇帖子解决了你的问题吗？如果你能提供一些反馈，我们将不胜感激。看不，这没有帮助。它只是将徽标和文本一起带到左侧。可能是因为我现在在中使用了两个

工具栏useStyles@a125试着让它独一无二，我只是指出了你代码中的错误。
const useStyles = makeStyles((theme: Theme) => ({
  toolBar: {
    justifyContent: 'space-between'
  },
  ...
...

<Toolbar className={classes.toolBar}>