javascript - react-select: stopPropagation when clicking on an option

Question

I have a react-select wrapped in a parent component. The parent has its own onClick which shouldn't fire when an option from the dropdown menu is clicked. However it should fire when the dropdown control is clicked and the menu expanded.

Due to how react-select is designed, the onChange prop doesn't actually pass the event, as there is a lack of reliable events for onChange.

I tried wrapping the select in another component with onClick={(e)=>e.stopPropagation}, but that stops the parent onClick from firing all together, while I only want to stop propagating when an option is clicked.

I guess another way of asking this question would be how to differentiate dropdown control click and menu option click in react-select. (and still, how to get the underlying event to be able to call event.stopPropagation)

Here's a similar question but the accepted answer didn't work for me.

标签： javascriptreactjsreact-select