Skip to content
New issue

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

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

Already on GitHub? # to your account

Scroller render doesn't account for the height of leading or trailing slots #685

Closed
danatcofo opened this issue Sep 28, 2021 · 3 comments · Fixed by #754
Closed

Scroller render doesn't account for the height of leading or trailing slots #685

danatcofo opened this issue Sep 28, 2021 · 3 comments · Fixed by #754

Comments

@danatcofo
Copy link
Contributor

Not sure how this is doing it under the covers but heres a video showing what I'm talking about.
Screen Recording 2021-09-28 at 5 25 50 PM

Inside the #before slot we have elements that get toggle to be sticky or relative. The sticky version works fine visually where the elements disappear and are reused smoothly. The relative version treats the area as if it where sticky... i.e preserving the #before slot sizing internally.

Is there something I can do to force or tell the scoller to use the area in the #before slot as well such that it doesn't have the blank area?

@danatcofo
Copy link
Contributor Author

I can reproduce this actually on the demo here https://akryum.github.io/vue-virtual-scroller/#/dynamic by setting the hight of the leading notice element to 500px in the developer tools.

So it appears that the logic doesn't account for leading height of the #before slot

@danatcofo danatcofo changed the title Dynamic scroller not using full vertical space for rendering items when a #before slot is not sticky Scroller render doesn't account for the height of leading or trailing slots Sep 29, 2021
danatcofo pushed a commit to stackify/vue-virtual-scroller that referenced this issue Sep 29, 2021
@danatcofo
Copy link
Contributor Author

Looks like a work-around for this bug is to set the :buffer="" to the height of the #before slot contents.

@semiaddict
Copy link

Seems like a duplicate of #510

Akryum added a commit that referenced this issue Oct 10, 2022
Akryum added a commit that referenced this issue Oct 10, 2022
Akryum pushed a commit that referenced this issue Oct 10, 2022
…lculating visible items, fix #685

Co-authored-by: Daniel Gidman <dgidman@netreo.com>
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
2 participants