使用 Material-UI 和 ReactJS 处理图标 onClick 事件

Question

我试图在单击时获取图标按钮的“名称”

我读过有关使用材质 UI 的内容，但我不断从处理程序中收到“未定义”消息

import React from 'react'
import {IconButton} from '@material-ui/core'
import InfoIcon from '@material-ui/icons/InfoOutlined'

const App = () => {

    const handleIconClicks = (e) => {
        console.log(e.target.name)
    }
    return (
        <div>
            <IconButton name="details" onClick={(e) => handleIconClicks(e)}>
                <InfoIcon />
            </IconButton>
        </div>
    )
}
export default App

handleIconClicks() 应该返回 event.target 的名称，而不是我得到未定义

Answer 1

event.target的情况下可参考图标<IconButton />。

您应该能够安全地使用event.currentTarget来获取按钮（并event.currentTarget.name获取其名称）。