如何在onClick事件綁定中傳遞參數？

我在ListItem中設置了onClick事件。然後在被調用的方法上調用.bind以傳入點擊的列表項的ID和名稱值。如何在onClick事件綁定中傳遞參數？

以下SO question建議使用綁定，但它似乎將onCLick事件添加到ListItem打破列表綁定。

在添加單擊事件之前，綁定到asset.name的列表跨度按預期工作，並且列表已填充。

此外，如果我嘗試onClick={this._onAssetSelected()沒有參數，click事件不起作用。

問：

你怎麼可以傳遞參數在JSX onClick事件綁定？

列表定義：

   <List selectable={true} selected={0}> 
       { 

        this.state.data.map(function (asset) { 
         return (
          <ListItem justify="between" onClick={this._onAssetSelected.bind(this, asset.name, asset.id)} > 
           <span>{asset.name}</span> 
          </ListItem> 
         ); 
        }) 

       } 
       </List>

的方法從單擊事件稱爲：

_onAssetSelected(assetName, assetID) { 

    console.log(assetName); 
    console.log(assetID);  


    }

來源

2016-09-27 Brian J

你可以做到這一點。定義一個anonymous函數作爲回調函數，其中用參數調用方法。跳轉幫助！

<List 
    selectable={true} 
    selected={0}> 
    { 

    this.state.data.map(function (asset) { 
     return (
      <ListItem 
       justify="between" 
       onClick={(e) => this._onAssetSelected(asset.name, asset.id, e)} > 
       <span>{asset.name}</span> 
      </ListItem> 
     ); 
    }) 

    } 
</List>

來源

2016-09-27 11:37:57

使用典型的關閉是一種方式。我也會傳遞完整的資產對象而不是特定的屬性。 – gor181

所以我定義了一個匿名函數如上。開發工具中的控制檯告訴我'未捕獲的TypeError：無法讀取'undefined'的屬性'_onAssetSelected'我可以看到這個方法是在類中定義的。或者我在這裏錯過了其他的東西？ –

您應該在渲染中的'return'之前添加'var _this = this'，並在地圖中使用'_this._onAssetSelected'。 –

如何在onClick事件綁定中傳遞參數？

回答

相關問題