检索单击了哪个按钮React/Material

gio*_*gim 3 javascript reactjs material-ui

我有几个动态生成的素材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.
 }
Run Code Online (Sandbox Code Playgroud)

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

 this.handleRegionClick = this.handleRegionClick.bind(this);
Run Code Online (Sandbox Code Playgroud)

May*_*kla 7

你可以做一件事,而不是将id分配给name,bind带有onClickfunction的id ,只要点击任何一个按钮,它就会将id传递给handleRegionClickfunction.

像这样:

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

a.map(item => {

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

})
Run Code Online (Sandbox Code Playgroud)

handleRegionClick 功能:

handleRegionClick(id){
  console.log(id);
}
Run Code Online (Sandbox Code Playgroud)

注意:arrow function此处不需要绑定,因为我们正在使用handleRegionClickonClick并bind正常调用.