这篇文章主要为大家详细介绍了Vue组件Draggable实现拖拽功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
Draggable为基于Sortable.js的vue组件,用以实现拖拽功能。
具体说明,请参考:学习链接
npm官方演示:
vuedraggable特性:
- 支持触摸设备
- 支持拖拽和选择文本
- 支持智能滚动
- 支持不同列表之间的拖拽
- 不以jQuery为基础
- 和视图模型同步刷新
- 和vue2的国度动画兼容
- 支持撤销操作
- 当需要完全控制时,可以抛出所有变化
- 可以和现有的UI组件兼容
使用
安装:
npm install vuedraggable
页面引入:
import draggable from 'vuedraggable'
data定义数据进行模拟:这是排序的案例,跟上面图不一样
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持本站。
以上就是Vue组件Draggable实现拖拽功能的详细内容,更多请关注本站其它相关文章!