vue拖动改变模板_vue实现div拖拽互换位置

本文实例为大家分享了vue实现div拖拽互换位置的具体代码，供大家参考，具体内容如下

template模板

draggable="true"

@dragstart="handledragstart($event, item)"

@dragover.prevent="handledragover($event, item)"

@dragenter="handledragenter($event, item)"

@dragend="handledragend($event, item)" >

script：

export default {

name: 'toolbar',

data () {

return {

items: [

{ key: 1, color: '#ffebcc'},

{ key: 2, color: '#ffb86c'},

{ key: 3, color: '#f01b2d'}

],

dragging: null

}

},

methods:{

handledragstart(e,item){

this.dragging = item;

},

handledragend(e,item){

this.draggin