wrote on mdn, scroll event bubbling not be canceled: https://developer.mozilla.org/en-US/docs/Web/API/Document/scroll_event
I'm currently experiencing a business is, in h5 page, the entire page need to decline (touchstart / touchmove / touchend, changePage ()) to switch pages on the support, but also support a certain area (scrollRegion) to scroll (scroll) within the page View list.
Once the scroll, the bubble will be touchstart / touchmove / touchend, and then perform operations changePage.
My current solution is to monitor touchstart / touchmove / touchend event in the parent component, once e.target specified scrollRegion, the changePage operation is not performed, perform only the default scroll operation.
How that judgment e.target specified scrollRegion in it, I just thought of a stupid way is to scrollRegion in the first class of name tags added all the same prefix 'xxx-', I just judgment e.target
Whether the first calssname have this prefix can be.
e.target.classList[0].split('-')[0] === 'xxx';
Code dirty feel to do so, but can not think of a better way, if the junior partner have a better method to prevent bubbling scroll, can comment or private letter, thank you.