mfuu / vue3-virtual-drag-list

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

Dynamic line height bug #18

Closed jimmyrogue closed 7 months ago

jimmyrogue commented 7 months ago

Hi

my component is a dynamic image list

so the height isn't const

when I scroll down everything is ok but when I scroll up

the scroll position will jump back to where load start

pls help me

thanks

20240329_182232

mfuu commented 7 months ago

@jimmyrogue Could you provide test case code, similar to codesandbox?

jimmyrogue commented 7 months ago

@mfuu here: case

funny thing is you must open web dev tool(F12) and the bug will show

I think some css trigger this bug

mfuu commented 7 months ago

@jimmyrogue It's caused by the size change of the image before and after loading.

jimmyrogue commented 7 months ago

@mfuu thanks but if I still need to calc the height of image by a function or dynamic, how to do it correctly ?

mfuu commented 7 months ago

@jimmyrogue I am trying to solve it, you can re-open the issue if you want

mfuu commented 7 months ago

@jimmyrogue Try to pass an estimated size with size prop, like:

<virtual-list :size="50"></virtual-list>
jimmyrogue commented 7 months ago

@mfuu thanks and I find if I calc the height earlier the problem will solve