Vue Slicksort Bug Report Template

Existing issues here: https://github.com/Jexordexan/vue-slicksort/issues

by Jordan Simonds

HTML

<script src="https://unpkg.com/vue-slicksort@latest/dist/vue-slicksort.min.js"></script>
<div id="app">
  <div class="root">
    <sortable-list lock-axis="y" v-model="items">
      <sortable-item v-for="(item, index) in items" :index="index" :key="index" :item="item"></sortable-item>
    </sortable-list>
  </div>
</div>

CSS

body {
  background: #FAFAFF;
  padding: 20px;
  font-family: Helvetica;
}

#app {
  background: #EEE;
  border-radius: 4px;
  border: 1px solid #EEE;
  transition: all 0.2s;
}

li {
  padding: 20px;
  list-style-type: none;
  cursor: pointer;
  background: #FFF;
  border-bottom: 1px solid #EEE;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

h2 {
  font-weight: bold;
  margin-bottom: 15px;
}

Vue

var { ContainerMixin, ElementMixin } = window.VueSlicksort;

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

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

var app = new Vue({
	el: '#app',
  name: 'Example',
  components: {
    SortableItem,
    SortableList,
  },
  data: function() {
    return {
      items: ['Item 1', 'Item 2', 'Item 3', 'Item 4', 'Item 5', 'Item 6', 'Item 7', 'Item 8'],
    };
  },
});