html5+vue无法拖拽,Vue拖拽排序插件Vuedraggable使用方法详解_心善_前端开发者

大家好，最近做的项目要用到拖拽排序，我现在的项目是

首先在

npm install vuedraggable -S

下载下来后，引入插件，在你的vue文件的script标签里面这样引入

import draggable from 'vuedraggable'

别忘了下面要注册组件

components: {

draggable

},

然后就可以在template标签里面使用了

{ {element.text}}

下面贴一下详细用法

{ {element.text}}

import draggable from 'vuedraggable'

export default{

data(){

return{

msg:"这是测试组件",

colors: [

{

text: "Aquamarine",

},

{

text: "Hotpink",

},

{

text: "Gold",

},

{

text: "Crimson",

},

{

text: "Blueviolet",

},

{

text: "Lightblue",

},

{

text: "Cornflowerblue",

},

{

text: "Skyblue",

},

{

text: "Burlywood",

}

],

startArr:[],

endArr:[],

count:0,

}

},

components: {

draggable

},

methods:{

getdata (evt) {

console.log(e