无法将元素的多个属性传递给Java脚本函数

由 发布于

我正在尝试从下面的元素传递id和name属性以处理Click事件，但仅传递了id。调试时名称显示为“未定义”。我有什么想念的吗

function App() {
  const [id, setId] = React.useState('')
  const [name, setName] = React.useState('')
  const handleClick = event => {
    debugger
    setName(event.target.id)
    setId(event.attribute)
  }
  return (
    <form>
      <svg width="800" height="250">
        <rect onClick={handleClick} id="0" name="Rectangle" x="10" y="10" width="150" height="150" fill="green" />
        <circle onClick={handleClick} id="1" name="Circle" cx="300" cy="90" r="75" fill="red" />
        <polygon onClick={handleClick} id="2" name="Triangle" points="500,10 600,160 400,160" style={{ fill: "blue" }} />
      </svg>
      <Display id={id} name={name} />
    </form>
  )
}

Debugging screen shot below enter image description here