从Material UI使用theme.breakpoints.down('')时出错

Question

我是一个初学者，我在前端使用material UI，我试图根据material UI中的文档使用theme.breakpoints.down来使我的应用程序响应，但它返回一个错误：

theme.breakpoints.down()

这就是我的代码：

const useStyle = makeStyles({
root : {
    height:"100vh",
    display:"flex",
    justifyContent:"space-evenly",
    alignItems:"center",
    [theme.breakpoints.down('sm')]:{
        flexDirection:"column"
    }
}

})

我想知道发生了什么，如果可能的话，可以做些什么来修复它。谢谢。

Answer 1

主题是一个函数和返回钩子，因此您可以将“makeStyles”作为参数传递

所以它应该是这样的：

const useStyle = makeStyles((theme)=>({
root : {
    height:"100vh",
    display:"flex",
    justifyContent:"space-evenly",
    alignItems:"center",
    [theme.breakpoints.down('sm')]:{
        flexDirection:"column"
    }
}}))