Skip to content

Rendering order is incorrect when changing data-sources array #403

Open
@charlesg99

Description

@charlesg99

Describe

Based on the example found here. When changing the order of the items in the data-sources, we can see in the vue devtools that the VirtualListItem are correctly updated, but aren't displayed in the order of their index property. I suspect this has to do with the patch strategy and it only happens when the items list comes from a computed property (so the data-sources array itself changes over time). Even if the array coming from the computed property changes, I would expect the items in the virtual list to be in the right order since the unique key and the object itself don't change.

Reproduce demo

If this example, looking at the console indicates that the items have the correct order, they just aren't displayed correctly. By using the array from the component's data instead of the computed property (replace data-sources="orderedModels" with data-sources="models") the reordering works correctly.

https://codesandbox.io/s/live-demo-virtual-list-forked-ezjcqr?file=/src/App.vue

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions