Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

onStateChange is never called #270

Open
lehnavid opened this issue Oct 9, 2020 · 1 comment
Open

onStateChange is never called #270

lehnavid opened this issue Oct 9, 2020 · 1 comment

Comments

@lehnavid
Copy link

lehnavid commented Oct 9, 2020

Don't know if I use the library in the correct way.

I have an < Element / > component which is first visible after scrolling down a little bit.
It sits together with some other elements, which can vary in their amount, depending how many the user adds.
The more the user adds, the more is < Element / > pushed to the bottom.

As soon as it hits the bottom of the viewport I want it to be sticky to the bottom.

As for now the onStateChange is never called.

I think I might just miss how to use this library properly :D

<Sticky
    bottomBoundary={window.innerHeight - 70}
    enabled
    onStateChange={(status) => {
      console.log(status);
    }}
    top={50}
>
    <Element />
</Sticky>
@steveluo
Copy link

steveluo commented Oct 15, 2020

I've also encountered this issue. It seems that react-stickynode doesn't support scrollable element, that is, I can't make the element sticky which is inside a scrollable element instead of window.

I have simply tried to add target option to the subscriber and it can handle scroll but unfortunately it can't update the scroll position:

    this.subscribers = [
      subscribe(`scrollStart`, this.handleScrollStart.bind(this), {
        target: scrollTarget,
        useRAF: true
      }),
      subscribe(`scroll`, this.handleScroll.bind(this), {
        target: scrollTarget,
        useRAF: true,
        enableScrollInfo: true
      }),
      subscribe(`resize`, this.handleResize.bind(this), { enableResizeInfo: true })
    ];

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants