ReactJS error语法错误:意外标记,应为;(19:21)(物料界面)

我是ReactJS新手,目前正在尝试将RaisedButton和MaterialUI中的表单对话框结合起来,但是,在尝试实现onClick函数时遇到了问题。 还有一个提醒:代码很长。我知道您应该使用一个“小而可验证的示例”,但是,我不知道哪些代码相关,哪些不相关,因为我对ReactJS太陌生了。

按钮脚本:

const styles = theme => ({
  button: {
    margin: theme.spacing.unit,
  },
  input: {
    display: 'none',
  },
});

function RaisedButtons(props) {

const { classes } = props;

 constructor(props) {
    super(props);
    this.handleClick = this.handleClick.bind(this);
}

handleClick = (e) => {
    this.classes.handleClickOpen();
};
  return (
    <div>
      <Button raised color="primary" className={classes.button} onClick={this.handleClick}>
        Create a new file
      </Button>
    </div>
  );
}
RaisedButtons.propTypes = {
  classes: PropTypes.object.isRequired,
};

export default withStyles(styles)(RaisedButtons);

这是对话框的脚本(意思是我的对话框组件中的按钮,它调用handleClickOpen函数,该函数按其名称执行)。

 <ButtonRaised handleClickOpen={this.handleClickOpen}/>

尝试运行代码时,我得到以下错误(对于我的RaisedButton脚本):

Syntax error: Unexpected token, expected ; (19:21)
  17 |  const { classes } = props;
  18 |   
> 19 |   constructor(props) {
     |                      ^
  20 |      super(props);
  21 |      this.handleClick = this.handleClick.bind(this);
  22 |  }

我的意思是,我知道问题在哪里,但我不知道如何解决它。我阅读了其他几个问题,其中指出函数可能没有正确定义,并显示了其他定义它们的方法,但没有任何帮助。 我尝试删除构造函数方法,但它告诉我handleClick没有定义。

将构造函数方法编写为

constructor = (props) => {
     super(props);
     this.handleClick = this.handleClick.bind(this);
}

,我得到以下错误:

Syntax error: 'super' outside of function or class (20:2)

有人知道我做错了什么,或者如何修复吗?