这篇文章中
https://andi.cn/page/621516.html
介绍了一个极简的 Vue 示例。
本文稍加修改，实现一个极简的 Vue draggable 拖曳排序例子，来看看：
<script src="https://cdn.uv.cc/vue/2.6.10/vue.min.js"></script>
<div id="app">
<draggable>
<div v-for="item of [1, 2, 3]">
一个极简的 Vue draggable 例子
{{item}}
</div>
</draggable>
</div>
<script src="//cdn.jsdelivr.net/npm/sortablejs@1.8.4/Sortable.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/Vue.Draggable/2.20.0/vuedraggable.umd.min.js"></script>
<script>
new Vue({
el: '#app',
})
</script>
本文在原来 Vue 的代码上修改了 3 处：
- 引入 Sortable.min.js
- 引入 vuedraggable.umd.min.js
- 给需要拖曳的添加 <draggable> 标签
去创作