[Vuejs]-How to synchronise JSON data with changes from DOM events (drag and drop)

This is actually very simple, you can just use the native HTML5 drag and drop API. Make an element draggable with draggable="true" and use @drop and @dragstart just like you would use the @click handler. I don’t know exactly how your data is structured since your question unfortunatly did not include any code but you can just use the dataTransfer.setData() and dataTransfer.getData() functions that come with these events. Remember Vue.js is data-driven in nature so try to avoid touching the DOM, it’s a slippery slope of untraceable bugs and unpredictable user experience from there on.