拖拽排序

1、npm

cnpm install awe-dnd --save

2、main.js

import VueDND from 'awe-dnd'
 
Vue.use(VueDND)

3、使用

<template>
  <div class="color-list">
      <div
          class="color-item"
          v-for="color in colors" v-dragging="{ item: color, list: colors, group: 'color' }"
          :key="color.text"
      >{{color.text}}</div>
  </div>
</template>

export default {
  mounted () {
    this.$dragging.$on('dragged', ({ value }) => {
      console.log(value.item)
      console.log(value.list)
      console.log(value.otherData)
    })
    this.$dragging.$on('dragend', () => {
 
    })
  }
}

 参考：https://www.npmjs.com/package/awe-dnd