How to bind an event in React?

Question

JavaScript

I want to add an id parameter to the event handler, but leave a reference to the event in order to call stopPropagation().
To do this, I use bind, where I pass event and id. But here's the problem, a completely different event is transmitted, that is, instead of mouse click, I get input. What could be the problem?

<li key={i}>
  <a href="##" onClick={this._onClick.bind(this, event, el.id)}>Какой-то текст</a>
</li>

Answer 1

Why such a method? Wouldn't it be easier to do this:

constructor(props){
this.handleClick = this.handleClick.bind(this);
}

handleClick() {
return (event, index, value) => { //Твой код}
}

Answer 2

<li key={i}>
  <a href="##" onClick={event => this._onClick(event, el.id) }>Какой-то текст</a>
</li>

In general, it is better to use refs

Answer 3

...

_handleClick = id => {
  return e => {
    e.stopPropagation();
    /* some actions */
  }
}
...
<a onClick={ this._handleClick(el.id) }></a>