petyosi / react-virtuoso

The most powerful virtual list component for React
https://virtuoso.dev
MIT License
5.25k stars 301 forks source link

I want ‘props‘ for initializing the scroll bar location #47

Closed gthdie closed 4 years ago

gthdie commented 5 years ago

I used react-virtuoso in all my projects. I can only add a unique class name to manipulate the native dom and get the last position of the scroll bar . On the next load, scroll to the previous position. I like react-virtuose.

petyosi commented 5 years ago

Can you describe what you want to achieve? Are you trying to persist the scroll location between reload? There is an imperative API for scrolling, but I can consider a prop, too, if I understand the case better.

Thanks!

gthdie commented 5 years ago

Maybe I want a ref prop and forward it to the scroll DOM so I can control the scroll location myself. Or add two props, initializing the scroll position and the callback function to get the scroll position, as ' react-window' did

Thanks!

NerdCowboy commented 5 years ago

Not entirely sure I'm following this, but adding the ability to set the initial scroll position would be awesome as right now there's a minor flash that's not so awesome that I'm try to make less jarring with a quick fade in.

For use case, I'm using Grouped Virtuoso with a list of events grouped by day, so if they navigate back from looking at an event from a specific date, I need the list to start at the date they were just looking at rather than the top.

@petyosi Or are you saying that this is something you can already do?

petyosi commented 5 years ago

@NerdCowboy You probably use the method scrollToIndex - the minor flash is there because the code needs to measure one item before calculating the probable location of the index.

Introducing a property like initialScrollPosition (and a respective scrollPositionChanged callback property) won't need the initial measurement.

petyosi commented 4 years ago

@NerdCowboy @gthdie the latest release includes the initialTopMostItemIndex - see example. @NerdCowboy - let me know if this works for your case so that I can bring this to the grouped component.

I think that scrolling to a certain index is what people will need (rather than passing the location directly). I might be wrong though - let me know your thoughts.

NerdCowboy commented 4 years ago

@petyosi it appears that should solve my use case. Thanks!

petyosi commented 4 years ago

@NerdCowboy - It works in Grouped Virtuoso as well: check this example.

Escalion86 commented 2 years ago

I think that scrolling to a certain index is what people will need (rather than passing the location directly). I might be wrong though - let me know your thoughts.

Unfortunately, this is not so. I periodically re-render the Virtuoso component and it would be great to remember its position. And if you remember the position of the element, then there will be a small shift every time

petyosi commented 2 years ago

@Escalion86 read the docs: https://virtuoso.dev/virtuoso-api-reference/#methods

ercangursoy commented 2 years ago

what about Grid? It'd nice to have this functionality in Grid as well.