说明:组件基于vue-draggable-resizable进行二次开发。
git引用于:GitHub - gorkys/vue-draggable-resizable: Vue2 Component for draggable and resizable elements.
根据上文描述与及二次开发提供的文档,进行总结。满满的干货,完美解决小伙伴们应拖拽而烦恼的项目,也适用新学习拖拽开发小白们。
1.定义组件是否开启冲突检测。
isConflictCheck
Type: Boolean
Required: false
Default: false
<vue-draggable-resizable :is-conflict-check="true">
2.定义组件是否开启元素对齐。
snap
Type: Boolean
Required: false
Default: false
<vue-draggable-resizable :snap="true">
3.当调用snap时,定义组件与元素之间的对齐距离,以像素为单位。
snapTolerance
Type: Number
Required: false
Default: 5
<vue-draggable-resizable :snap="true" :snap-tolerance="20">
由于属性和事件太多,没有全部展示上来,下面链接是分享整理在有道笔记的链接,想看的可以直接点击。