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

[Bug Report][3.1.4] VVirtualScroll is not adjusting scroll for newly added items #16725

Closed
sanjay-bhuva opened this issue Feb 20, 2023 · 5 comments · Fixed by #16736
Closed
Assignees
Labels
C: VVirtualScroll labs P: elite sponsor T: bug Functionality that does not work as intended/expected
Milestone

Comments

@sanjay-bhuva
Copy link

sanjay-bhuva commented Feb 20, 2023

Environment

Vuetify Version: 3.1.4
Vue Version: 3.2.45
Browsers: Chrome 109.0.0.0
OS: Mac OS 10.15.7

Steps to reproduce

As you can see in the reproduction playground link. Initially, I am having 10 items for virtual scroll and adding 5 new items after every 5 seconds.

Once new items are added, the scroll is not adjusted automatically until you scroll to the top (at least a item)

Expected Behavior

Scroll should adjust automatically based on the number of items without scrolling to top/bottom

Actual Behavior

Scroll is not adjusting until user scrolls to top (at least a item)

Reproduction Link

https://play.vuetifyjs.com/#...

@KaelWD
Copy link
Member

KaelWD commented Feb 21, 2023

Any particular reason you're using visibleItems?

@sanjay-bhuva
Copy link
Author

Any particular reason you're using visibleItems?

@KaelWD we want to keep visibleItems number low here. You can think of board columns (having virtual scroll) with lots of cards. Let's say the visible items are 10 for each column. It will be 50 components for 5 columns with their own sub-components.

Not sure if the visibleItems is an issue here because if the user is fully scrolled and the number of items changes, you have to scroll up and then back down to render them.

@KaelWD
Copy link
Member

KaelWD commented Feb 21, 2023

By default it's automatically calculated from the container height and item height. If you set it too low you'll get flickering an other problems, it was actually supposed to be removed in #16495

Not sure if the visibleItems is an issue here

It isn't really, it's just slightly less broken without it

@sanjay-bhuva
Copy link
Author

sanjay-bhuva commented Feb 21, 2023

If you set it too low you'll get flickering

@KaelWD I am getting a flickering issue when I scroll to the bottom if I remove visibleItems and VVirtualScroll do not have height and using parent's height. You can see the playground demo here

Is it compulsory to pass height to VVirtualScroll? Is it possible to use parent height?

@KaelWD
Copy link
Member

KaelWD commented Feb 21, 2023

That's a separate bug, never tested with so few items.

Is it compulsory to pass height

No, you can see in that example it's filling the sheet.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
C: VVirtualScroll labs P: elite sponsor T: bug Functionality that does not work as intended/expected
Projects
None yet
3 participants