如何在React中点击图片发送道具

Question

我正在Material-UI中使用Dialog组件。

我设置了onClick，以便在单击图像时可以打开对话框。

<img
  onClick={this.handleClickOpen}
  alt="..."
  src={studio2}
  className={navImageClasses}
/>

这是对话框在代码级别的外观

<Dialog
  open={this.state.open}
  TransitionComponent={Transition}
  keepMounted
  onClose={this.handleClose}
>
  <DialogTitle id="alert-dialog-slide-title">
    {"Test title"}
  </DialogTitle>
  <DialogContent>
    <DialogContentText id="alert-dialog-slide-description">
      {"I wanna put the image here."}
    </DialogContentText>
  </DialogContent>
</Dialog>

当我单击图像时，我想将整个图像标签传递到，以便可以显示放大的图像。由于我是React的新手，所以我在这里很迷失。有人可以帮我吗？

Answer 1

e.target拥有您需要的所有道具：

handleClickOpen = e => {
  console.log(e.target.src)
}