Typescript将映射的元素传递给Function onclick

Question

我正处于Typescript应用程序的初始阶段，作为概念验证，我希望在单击按钮时简单地提醒每个项目的ID。如何添加项目。下面onclick Alert函数的ID？

<table style="background-color:#FFFFFF;width:100px;">
{resolvedValue.map((item, index) => (
<tr key={index}>
<td>
{item.id}
</td>
<td>
<button onclick="javascript:alert('Adding {item.id} ');">Add</button>
</td>
</tr>
))}
</table>

更新以下答案：

<table style="background-color:#FFFFFF;width:100px;">
{resolvedValue.map((item, index) => (
<tr key={index}>
<td>
{item.id}
</td>
<td>
<button onClick={() => alert('Adding')}>Add</button>
</td>
</tr>
))}
</table>

Answer 1

只需使用React的onClick函数。看见https://codesandbox.io/s/keen-driscoll-mx8dy

<table style={{ "background-color": "#FFFFFF", "width": "100px" }}>
{resolvedValue.map((item, index) => (
<tr key={index}>
<td>
{item.id}
</td>
<td>
<button onClick={() => alert('Adding' + item.id)}>Add</button>
</td>
</tr>
))}
</table>