Mouse scroll event Is not working for react select inside react scrollbar

Question

I am using two packages:

1. react-select
2. reactScrollbar

I am using react scroller for smooth scrolling in my project. Inside the react scroller I am using react-select for smooth drop down.

Issue: Whenever I scroll for my react select dropdown. The parent scroll event also get fired and react-select closed it's dropdown. Due to that I am unable to select the value form dropdown.

Answer 1

My onWheel was scrolling the parent react-scrollbar scroll, so i added onWheel handler as follows on parent div of react select. Hope this helps

onWheel=(e)=>{
 e.stopPropagation();
}

<div onWheel={this.onWheel}
 <Select ../>
</div>