useStyles 钩子在 Material-ui 中不起作用

Question

我正在尝试将 css 样式添加到 material-ui 组件但样式不起作用，请检查我添加的按钮组件 className ={classes.btn}，没有警告并且给出的错误。

这里是代码

import "./App.css";

import { Button, Container, Typography } from "@mui/material";
import KeyboardArrowRightIcon from "@mui/icons-material/KeyboardArrowRight";

import { makeStyles } from '@mui/styles';

const useStyles = makeStyles({

btn:{

  fontSize:50,
  backgroundColor:"green"
}  


})


function App() {
 
const classes = useStyles()
 
  return (
    <Container>
    
      <Button
    className={classes.btn}
        variant="contained"
        color="error"
        type="submit"
        onClick={() => {
          console.log("you clicked me ");
        }}
        endIcon={<KeyboardArrowRightIcon />}
      >
        Submit
      </Button>
    </Container>
  );
}

export default App;

Answer 1

试试：

const useStyles = makeStyles({
  btn: {
    fontSize: "50px !important",
    backgroundColor: "green !important"
  }
});