JSFiddle - React, Tailwind, and code Playground

HTML

<div class='container'>
    <div class='scrollMe'>
        <div class='filler'></div>
        <div class='filler'></div>
        <div class='filler'></div>
        <div class='filler'></div>
        <div class='filler'></div>
        <div class='filler'></div>
    </div>
</div>

CSS

body {
    height: 2000px;
}

.scrollMe {
    position: absolute;
    overflow: auto;
    border: 1px solid #000;
    height: 200px;
    width: 20px;
}
.filler {
    width: 20px;
    height: 20px;
    background: #f00;
    border: 1px solid #000;
}

JavaScript

$(document).ready(function() {
        $('.scrollMe').bind("mousewheel DOMMouseScroll", function(e) {
            e.stopImmediatePropagation();
            e.stopPropagation();
            e.preventDefault();
        
        var delta = parseInt(e.originalEvent.wheelDelta || -e.originalEvent.detail);

        $(this).empty();    
        return false;
    });
});