Как повесить слушателя на существующий дом елемент ReactJS?

Question

[Альберт Табак]

Как повесить слушателя на существующий дом елемент ReactJS ?

Например я рендерю на сервере радио баттоны. Если юзер кликает один из них, мне нужно показывать соответствующий контент, как повесить слушателя на него это батона и передать их в реакт ?

Answer 1

[KnightForce]

Повесить слушателя можно так:
А)
1) В теге jsx написать ref={(elem)=>{this.elem = elem}}
2) В коде или в том же ref написать:
elem.addEventListener
Но это не лучшая практика.

Б)

class NavigationBlock extends Component {

  constructor(props) {
    super(props);
    this.props=props;
    this.handlerClick=this.handlerClick.bind(this);
  }

  handlerClick(e) {
      //обработка клика
  }

  render() {
      let emenets = bigArrayData.map((item)=>{
          return <div onClick={this.handlerClick}>item</div>
      }); 
      return <div>{elements}</div>
  }
}

Если тебе нужно отследить какой инпут нажат, можешь пойти таким путем:
А) отлавливать что-то через e.target.
Б)

handlerClick(number) {
       return (e)=>{
              alert(number); //Типа обработка
       }
  }

  render() {
      let emenets = bigArrayData.map((item, i)=>{
          return <div onClick={this.handlerClick(i)}>item</div>//вместо i любое значение
      }); 
      return <div>{elements}</div>
  }