container onScroll listen

[javaxiu]

here is listening to the window scroll event, but what if the scroll area is a div not the window, it seems won't be able to work , especially onFetchMore . so... i am getting stuck in this issue https://github.com/thmsgbrt/react-simple-pull-to-refresh/blob/b91b3eff46210b5c5e7e95d6b02a83e0d1a4eb45/src/components/pull-to-refresh.tsx?_pjax=%23js-repo-pjax-container%2C%20div%5Bitemtype%3D%22http%3A%2F%2Fschema.org%2FSoftwareSourceCode%22%5D%20main%2C%20%5Bdata-pjax-container%5D#L56

[vitorzerbeto]

You need to add the scroll event on the div that the react-simple-pull-to-refresh creates around your content. Something like this:

const ptr = document.querySelector(".pull_to_refresh .ptr__children");
ptr.addEventListener('scroll', onScroll)

[helzapps]

So the suggestion by @vitorzerbeto doesn't seem to work. I can get the querySelector to find what I believe is the appropriate div, but the 'scroll' event is never fired because I don't think it's actually scrolling anything. Based on the styles I'm seeing added to the .ptr__children div, they are applying a transform to that div such that it's not scrolling, but being offset as the user clicks and drags. I'm in a situation where my child elements are divs with an onClick event that if my drag/scroll starts and ends inside of that div, then it's firing the onClick method when I don't think it should because the user was merely scrolling/click and dragging. Eventually, my project will be run inside of a native App wrapper, so the events will be touch down and drag, which is extensibly a scroll on mobile, and generally with native scroll views, the act of scrolling/dragging cancels out the event chain to propagate touch events to the children. So I'm looking for a way to detect that click/drag event in order to perform a similar function of not passing on those events to the children whilst scrolling. Is there a way to do this with the component as is?