search

mfuu / vue-virtual-drag-list

A virtual scrolling list component that can be sorted by dragging
https://mfuu.github.io/vue-virtual-drag-list/
MIT License
32 stars 11 forks source link

Feature request: maintain position when @top and @bottom events are triggered #5

Closed mrooding closed 1 year ago

mrooding commented 2 years ago

I'm using the @top and @bottom event callbacks to fetch more items depending on where the user is within the virtual list data. When triggering @top an HTTP call is done to fetch additional data and the list is updated. However, the list jumps to the first item in the updated result instead of staying at the beginning of the list before fetching additional items.

An example:

I'm displaying items 400 - 600 and the user scrolls to the top. Item 200 to 400 are being fetched. The top of the list is shown and item 200 is the first to be shown.

It would be nice if the list stays around item 400 and the user is able to scroll up towards 200.

Could this be added to the library as a configurable property?

As a workaround, I'm now storing the ID of the item in the list before fetching additional data and then using a watch to scroll back to the new index in the list based on the ID.

mfuu commented 2 years ago

@mrooding This issue is supported in the latest version, use the props with keepOffset

mrooding commented 2 years ago

Thank you @mfuu! I'll try it out a.s.a.p.