A Vue Dragable (Vue.js 2.0) or directive (Vue.js 1.0) component that allows drag-and-drop and synchronization with the view-model. Based on and providing all the features of Sortable.js.
vue draggable example, vue draggable resizable, drag and drop touch screen javascript, html touch drag event, html5 touch drag and drop, vuedraggable, vue draggable npm
How to make use of it:
Install & Download:
yarn add vuedraggable npm i -S vuedraggable
Use draggable component:
<draggable v-model="myArray" group="people" @start="drag=true" @end="drag=false">
<div v-for="element in myArray" :key="element.id">{{element.name}}</div>
</draggable>import draggable from 'vuedraggable'
...
export default {
components: {
draggable,
},
...Advanced Touch-enable Draggable Component, Vue Draggable Plugin/Github, draggable not working in mobile
See Demo And Download
Official Website(SortableJS): Click Here
This superior jQuery/javascript plugin is developed by SortableJS. For extra Advanced Usages, please go to the official website.