检索在Reaction中单击的按钮

我有几个动态生成的材料UI按钮，当用户单击其中任何一个按钮时，我想知道哪个按钮被单击了(假设获取我在下面分配的name属性的值)。 如何才能解决这个问题呢？基本上，我想检索被单击的按钮的某些属性。 以下是一些代码

    {
      that.state.items.map(function (item) {
        return (
          <div key={item.id}>
            <FlatButton
              label={item.regionName}
              name={item.id}
              primary={true}
              onClick={that.handleRegionClick}
            ></FlatButton>
          </div>
        );
      });
    }
    
    handleRegionClick(e);
    {
      console.log(e.target.name); // This prints undefined
      // If I could get here the _item.id_ which I assigned to _name_ I would be fine.
    }

PS。我在构造函数中也有这个

 this.handleRegionClick = this.handleRegionClick.bind(this);

---

解决方案

您可以做一件事，而不是使用onClick处理函数将ID分配给名称。无论何时单击任何按钮，它都会将该ID传递给处理程序函数。

这样：

let a = [{ id: 1 }, { id: 2 }, { id: 3 }];

a.map(item => {

   return <FlatButton
    label={item.regionName}
    primary={true}
    onClick={() => this.handleRegionClick(item.id)} />

})

handleRegionClick功能：

handleRegionClick(id){
  console.log(id);
}

注意：这里不需要绑定handleRegionClick，因为这里使用的是arrow function和onclick，正常调用handleRegionClick。