How to correctly build the logic of transferring data from object to object in javascript?

Question

JavaScript

Task: creating a mosaic of multi-colored squares-objects.
So far, I'm leaning towards this logic: the squares-objects in the mosaic are already placed, but all have the property - gray.
In the other zone, there are multi-colored objects that we drag onto the corresponding squares of the mosaic and transfer data from object to mosaic object.
The question is, is this approach correct? And the second question is how to pass data from object to object using vue.js?

Answer 1

The question is, is this approach correct?

Well, since you intend to use vue - fundamentally wrong. When you say "object" you mean an element of the DOM tree, while vue assumes data comes first. For example - it seems to be done exactly according to your description, but note that it is based on data, not markup - elements are created based on arrays, elements are not directly modified, instead the contents of the array are changed.