Javascript 将函数转换为类错误（'；主题'；未定义无未定义）

我是react的新手，我在我的项目中使用过，现在我想把抽屉的函数改成类，我的问题是类不能识别主题，这是我的代码

#import .....
const useStyles = theme => ({
root: {
display: 'flex',
},
appBar: {
    transition: theme.transitions.create(['margin', 'width'], {
    easing: theme.transitions.easing.sharp,
    duration: theme.transitions.duration.leavingScreen,
}),
 //........ there is more of them
}
class Test extends React.Component{
constructor(){
  super()
  this.state={
    open: true,
  }
}
render(){ 
   const { classes } = this.props;
    return(
       <IconButton onClick={this.handleDrawerClose}>
            {theme.direction === 'rtl' ? <ChevronLeftIcon /> : <ChevronRightIcon />}
       </IconButton>
   );}
}

#导入。。。。。
const useStyles=主题=>({
根目录：{
显示：“flex”，
},
appBar：{
transition:theme.transitions.create（['margin'，'width']{
放松：主题。过渡。放松。尖锐，
持续时间：theme.transitions.duration.leavingScreen，
}),
//……还有更多
}
类测试扩展了React.Component{
构造函数（）{
超级（）
这个州={
开放：是的，
}
}
render（）{
const{classes}=this.props；
返回(
{theme.direction==='rtl'？：}
);}
}

导出默认测试； 我的问题是，

theme.direction==“rtl”

---

您的代码中没有定义

主题

，当您定义

主题时，您期望得到什么？方向

？@bertdida我应该如何定义主题？从

@material ui/core/styles

导入

使用主题

，并在渲染方法的第一行尝试

const theme=useTheme（）；

。如果不起作用，请包括一个代码沙盒。@bertdida我添加了沙盒链接tnxCheck out。