React-catch滚轮，但忽略滚动条

Question

我试图创建一个滚动视口高度增量功能，我意识到我只想将它应用于鼠标滚轮。

有关如何执行此操作的建议？

如果您能告诉我为什么我的handleScroll函数在单个滚动操作后反复重复，那么这是额外的功劳。

FIDDLE:

componentDidMount() {
    window.addEventListener('scroll', this.handleScroll)
  }

  componentWillUnmount() {
    window.removeEventListener('scroll', this.handleScroll)
  }
  handleScroll(e) {
    var didScroll;
    var delta = 71;
    clearTimeout($.data(this, 'scrollTimer'));
      $.data(this, 'scrollTimer', setTimeout(() => {
        didScroll = true;
        if (didScroll) {
          var vh = $(window).height();
          hasScrolled(vh);
          didScroll = false;
        }
      }, 40));
    function hasScrolled(vh) {
    var st = $('body').scrollTop();
    var scrolldown = st + vh;
    var scrollup = st - vh;
    if (Math.abs(lastScrollTop - st) <= delta)
      return;
    if (st > lastScrollTop && st > 70) {
      console.log('scrolltop: ' + st + ', viewport height: ' + vh + ', scrolltop DOWN: ' + scrolldown);
      $('body').animate({
          scrollTop: scrolldown
      }, 300, 'swing');

    } else {
      console.log('scrolltop: ' + st + ', viewport height: ' + vh + ', scrolltop UP: ' + scrollup);
      $('body').animate({
          scrollTop: scrollup
      }, 300, 'swing');
    }
    lastScrollTop = st;
    }
  }