Is it possible to bind blocks/components to an array/object?

Question

Vue.js

Demo I have a draggable
component that contains blocks that I want to change position manually using drag and drop . With a list, everything is easy, but it does not suit me (not sure). Is it possible to somehow bind the blocks/components inside the draggable to an array/object in data so that I can store this data on the back and load it accordingly? In the example, you can see that testList changes in accordance with the movement of the elements of the list. But in the example of moving blocks - list2 changes values, but the blocks themselves do not change their position. This is the effect I want to achieve: gif

Answer 1

Each draggable element has x y width and height. It's all fine to shrink down on the list. What is your problem?

Answer 2

list2has nothing to do with itemunlike testList. In list2you should not lie numbers, but objects with data, according to which the corresponding will be built item, the items themselves must be listed through v-for, so that when they list2change, their order also changes.
What you want to do is probably through the render function and $children, but this library doesn't do that. Yes, and you don't really need it.