vue-slicksort

npm install vue-slicksort --save
or
yarn add vue-slicksort

<script src="https://unpkg.com/vue-slicksort@latest/dist/vue-slicksort.min.js"></script>

//ES6
import { ContainerMixin, ElementMixin } from 'vue-slicksort';

// ES5
var slicksort = require('vue-slicksort');
var ContainerMixin = slicksort.ContainerMixin;
var ElementMixin = slicksort.ElementMixin;

// 浏览器cdn引入的
var { ContainerMixin, ElementMixin, HandleDirective } = window.VueSlicksort;

import Vue from 'vue';
import { ContainerMixin, ElementMixin } from 'vue-slicksort';

const SortableList = {
  mixins: [ContainerMixin],
  template: `
    <ul class="list">
      <slot />
    </ul>
  `
};

const SortableItem = {
  mixins: [ElementMixin],
  props: ['item'],
  template: `
    <li class="list-item">{{item}}</li>
  `
};

const ExampleVue = {
  name: 'Example',
  template: `
    <div class="root">
      <SortableList lockAxis="y" v-model="items">
        <SortableItem v-for="(item, index) in items" :index="index" :key="index" :item="item"/>
      </SortableList>
    </div>
  `,
  components: {
    SortableItem,
    SortableList
  },
  data() {
    return {
      items: ['Item 1', 'Item 2', 'Item 3', 'Item 4', 'Item 5', 'Item 6', 'Item 7', 'Item 8']
    };
  }
};

const app = new Vue({
  l: '#root',
  render: h => h(ExampleVue)
});