React—catch scroll wheel, but ignore scrollbar - reactjs

Question

I'm trying to create a scroll-in-viewport-height-increments function and I'm realizing that I only want it to apply to the mousewheel.
Suggestions on how to do this?
Extra credit if you can tell me why my handleScroll function repeats over and over after a single scroll action.
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;
}
}