Material Ui (reactjs) -在appBar中居中显示徽标图像

import React from 'react';
import { AppBar, Toolbar, Typography } from '@material-ui/core';
import { makeStyles } from '@material-ui/core/styles';

const useStyles = makeStyles((theme) => ({
  appBar: {
    display: 'flex',
    justifyContent: 'center',
  },
  logo: {
    width: 100, // 根据实际需求调整徽标图像的大小
  },
}));

const MyComponent = () => {
  const classes = useStyles();

  return (
    <AppBar position="static" className={classes.appBar}>
      <Toolbar>
        <img src="/path/to/logo.png" alt="Logo" className={classes.logo} />
      </Toolbar>
    </AppBar>
  );
};