title: React: how to pass arguments to the callback
body: <p>I have a list of elements inside my react component, and I want them to be clickable. On click I call some external function passing item ID in arguments:</p>
  
  <pre><code>render () {
    return (
      &lt;ul&gt;
        {this.props.items.map(item =&gt; (
          &lt;li key={item.id} onClick={() =&gt; {doSomething(item.id)}&gt;&lt;/li&gt;
        ))}
      &lt;/ul&gt;
    )
  }
  </code></pre>
  
  <p>This code works, but it has a big performance drawback: a lot of new anonymous functions are being created on each call to <code>render</code>.</p>
  
  <p><strong>How can I pass that <code>doSomething</code> function as a reference here while still being able to provide a <code>item.id</code> to it?</strong></p>