React Button 元素 id 给出空字符串

Question

单击按钮时，我想在 function 调用中传递我的 Button 的 ID。 但是怎么做呢？ 我阅读了可用的解决方案，但没有任何帮助。

问题：下面的代码在控制台中打印一个空字符串

期望： paras123 应该被打印出来

<TableCell align="center">
   <Button id="paras123" onClick={(e)=>console.log(e.target.id)}>
      Pre-Session Form
   </Button>
 </TableCell>

Answer 1

因为target是跨度显示文本Pre-Session Form 。 您需要使用 currentTarget 来获取按钮 id：

onClick={(e) => console.log(e.currentTarget.id)}

Answer 2

检查target ： console.log(e.target) 。 它会像这样响应

<span class="MuiButton-label">Pre-Session Form</span>

没有id值。 如果您的想法是打印paras123 ，请查看此示例链接。

https://codesandbox.io/s/damp-paper-ftumv?file=/src/App.js:1592-1595