React 获取点击按钮的 ID

Question

我有 5 个可点击的链接，每个链接都有唯一的 ID。我正在尝试获取被单击的链接的 ID。我尝试了两种方法，但都没有达到我想要的效果。

内部渲染我有：

this.state.data.map((dynamicData, key) =>
  <a href={"/#/template"} id={dynamicData.id} onClick={() => this.reply_click(this.id)}>{dynamicData.name}</a>
  <a href={"/#/addTeams"}><button type="button" class="btn-lisa">Edit</button></a>

返回未定义的基本方法。我究竟做错了什么？：

reply_click(clicked_id) {
  console.log(clicked_id);
}

Answer 1

使用箭头函数将从外部维护上下文this，这不是this您想要的。您可以尝试使用常规函数 ( function () { }) 代替，但我不确定是否this是您想要的。

但是，您绝对可以使用它e.target.id来获得您想要的东西：

onClick={e => this.reply_click(e.target.id)}

也就是说，您确实应该避免在事物内部创建函数，因为它可能会造成严重的性能问题。最好只创建一个函数并将其传入：

// somewhere above
const handleClick = e => this.reply_click(e.target.id);

// attribute
onClick={handleClick}