传递的onClick参数未定义

Question

我正在使用ReactJS功能组件来显示附件列表，并希望通过附件div上的onClick传递参数，但是我在handleAttachmentClick函数中获取的参数是未定义的。我在return函数中使用{attachments}显示附件。以下是相关代码：

const [attachmentclicked, setAttachmentClicked] = useState({})

const [visible, setVisible] = useState(false)

const [attachments, setAttachments] = useState([])

useEffect(() => {
  displayAttachments();
}, [])

const handleAttachmentClick = (attachmentclick) => {
  console.log(attachmentclick)
  setAttachmentClicked(attachmentclick)
  setVisible(true)
}

const displayAttachments = () => {
  if (props.data.attachment.length > 0) {
    for (i=0; i<props.data.attachment.length; i++) {
      console.log(props.data.attachment[i])
      tempattachments.push(<div onClick={() => 
      handleAttachmentClick(props.data.attachment[i])}><PaperClipOutlined /><span> 
      {props.data.attachment[i].filename}</span></div>)
      setAttachments(tempattachments)
    }
  }
}

return (
    <div>
        {attachments}
    </div>
)

在displayAttachments中返回console.log（props.data.attachment [i]）的示例：

{size: 10210, data: "_9j_4AAQSkZJRgABAQAAAQABAAD_2wCEAAkGBxMTEhUTEhMWFh…CQPEQK1UXUqpJqc4loII6cCCCCAAggggAIIIIACCCCAD_2Q==", result: {…}, filename: "1x1_red_pixel.jpeg", type: "image/jpeg"}

但是，handleAttachmentClick中的console.log（attachmentclick）返回未定义。