檢索哪個按鈕被點擊反應/材質

我有幾個動態生成的材質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);

來源

2017-04-25 Giorgi Moniava

一個問題，你如何在任何循環內動態生成按鈕？ –

@MayankShukla是的，在地圖 –

你可以做一兩件事，而不是分配的ID來命名的，bind該ID與onClick功能，只要任一按鈕被點擊它會將該ID傳遞給click函數。

像這樣：

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

a.map(item => { 

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

})

handleRegionClick功能：

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

注：的handleRegionClick結合，因爲在這裏我們使用arrow function用的onClick和調用handleRegionClick通常這裏不需要。

來源

2017-04-25 07:34:37

這個作品：onClick = {（）=> that.handleRegionClick（item.id）}（在我的情況下使用，而不是這個渲染） –

-1

也許試圖綁定that.handleRegionClick（）這個？

that.handleRegionClick.bind(that)

那麼你應該能夠訪問e.target

來源

2017-04-25 07:30:24 manelgarcia

你的問題對我來說很奇怪。你可以簡單地做到這一點。

<FlatButton label={item.regionName} name={item.id} primary={true} onClick={that.handleRegionClick.bind(this, item.id)}></FlatButton> 

handleRegionClick(itemId){ 
    console.log(itemId) 
}

來源

2017-04-25 07:35:13

請勿爲此使用onClick。相反，當您生成按鈕時，請添加一個事件偵聽器。如果你這樣做，那麼你可以通過e.toElement訪問點擊元素，並使用e.toElement.name訪問它的名稱屬性（看起來像你的item.id在名稱屬性中）。

for (...) { // however many buttons you generate 
    var x = generateButtonSomehow(); // make sure it returns the DOM element 
    x.addEventListener('click', function(e) { 
     console.log(e.toElement.name); 
    }); 
}

來源

2017-04-25 07:35:36

檢索哪個按鈕被點擊反應/材質

回答

相關問題