how to make a div draggable in vue js?

2019-08-23 23:44发布

问题:

I have a div inside a vue component, I want to make the component draggable. I checked with many vue draggable plugins, but they have a seperate component for drag and not as a directive to just add like in angular draggable. Please help me with this?

回答1:

You need to add vuedraggable to your node modules.

yarn add vuedraggable

and then:

  import draggable from 'vuedraggable'
  ...
  export default {
        components: {
            draggable,
        }

and then you need something like this:

<draggable>
    <div v-for=...>
    </div>
</draggable>

https://github.com/SortableJS/Vue.Draggable