Molette de la souris événements dans Reactjs
Comment allez-vous obtenir molette de la souris événements dans reactjs?
J'ai essayé onWheel
render: function() {
return <div onWheel = {this.wheel} >
< /div>;
},
et j'ai essayé onScroll
render: function() {
return <div onScroll = {this.wheel} >
< /div>;
},
Mais aucun de ces événements sont ramassés. Voir le violon, ci-dessous :
https://jsfiddle.net/812jnppf/2/
Théoriquement, les onWheel synthétique de l'événement est ce que vous voulez à utiliser, j'ai des os nus de création de réagir-app, et onWheel fonctionne très bien pour moi. Je ne peux pas faire de votre jsfiddle de travail pour les événements de la roulette, mais cliquez sur événements ne sont pas un problème: jsfiddle.net/812jnppf/8
OriginalL'auteur Oliver Watkins | 2017-07-20
Vous devez vous connecter pour publier un commentaire.
Tout d'abord, votre div 0 hauteur, afin de ne pas défiler. Vous n'avez pas à lier ce que c'est une classe (et non pas une es6 réagir composant). Il suffit de faire appel à la fonction à l'événement en tant que paramètre sur onWheel événement:
https://jsfiddle.net/812jnppf/9/
Bien sûr, vous avez besoin de nettoyer le code pour le style de votre div avec un var ou dans le css.
EDIT : je l'ai mis onWheel et pas sur onScroll (sorcière n'existe pas, je suppose ? de le confirmer, si vous le savez). J'ai vu un post sur l'ajout d'événement scroll de votre composant facilement : https://stackoverflow.com/a/29726000/4099279
Autant que je sache,
(e) => this.wheel(e)
est le même quethis.wheel
, sauf pour la création d'un nouvel objet à chaque fois et donc de forcer un nouveau rendu. +++onScroll
existe et fonctionne, je l'utilise.OriginalL'auteur Nevosis
Lier le rappel à
this
:OriginalL'auteur niellus