События колесика мыши в Reactjs

Как вы идете о получении событий колеса мыши в reactjs?

Я пробовал onWheel

  render: function() {
    return <div onWheel = {this.wheel} >
       < /div>;
  },

и я попробовал onScroll

  render: function() {
    return <div onScroll = {this.wheel} >
       < /div>;
  },

но ни одно из этих событий взял. См. скрипку ниже:

https://jsfiddle.net/812jnppf/2/

7
reactjs

2 ответов

во-первых, ваш div имеет высоту 0, поэтому вы не прокручиваете его. Вам не нужно связывать это, поскольку это класс (а не компонент ES6 react). Просто вызовите функцию с событием в качестве параметра onwheel event:

https://jsfiddle.net/812jnppf/9/

render: function() {

   return <div style={{height:300, width:300}} onWheel = {(e) => this.wheel(e)} >      < /div>;
},

конечно, вы должны очистить код, чтобы стиль вашего div с var или в css.

EDIT: я установил его на колесо, а не на onScroll (ведьма не существует, я думаю ? подтвердите это, если вы знать.) Я видел сообщение SO о добавлении события прокрутки в ваш компонент easilly:https://stackoverflow.com/a/29726000/4099279

4

привязать обратный вызов к this:

render: function() {
    return <div onWheel = {this.wheel.bind(this)} >
       < /div>;
}
2