元素拖拽组件
- Source:
Members
(inner) props
- Source:
Properties:
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
handle |
String | HTMLElement | function | 拖拽句柄元素，默认组件根元素，支持选择器、元素对象和函数，函数必须返回元素对象 |
||
axis |
String |
<optional> |
限制拖拽方向可选: v 垂直、h 水平，默认不限制 |
|
delay |
number |
<optional> |
100
|
延时开始拖拽 |
range |
Object | function |
<optional> |
限制拖拽范围, 默认不限制, 对象属性包含(left,top,width,height)，函数必须返回这个对象 |
|
target |
String | HTMLElement | function |
<optional> |
在目标元素范围内拖拽，支持选择器、元素对象和函数，函数必须返回元素对象 |
|
clone |
Boolean | function |
<optional> |
是否克隆拖拽元素, 函数可自定义克隆元素 |
|
revert |
Boolean |
<optional> |
拖拽放置后动画返回原来位置，clone为true时才有效 |
|
group |
String |
<optional> |
分组名称， 与my-drop配合使用 |
|
disabled |
Boolean |
<optional> |
是否禁用拖拽 |
|
data |
* |
<optional> |
附加数据 |
|
cloneClass |
string |
<optional> |
克隆元素添加 className |
|
origin |
String | HTMLElement | function |
<optional> |
原点元素，默认自动获取，支持选择器、元素对象和函数，函数必须返回元素对象 |
|
appendBody |
Boolean |
<optional> |
克隆的节点是否加到body |
属性参数
(inner) slots
- Source:
Properties:
| Name | Type | Description |
|---|---|---|
default |
string | 默认插槽，定义内容 |
插槽
Methods
(inner) getRelativeEl()
- Source:
获取拖拽元素相对位置参考元素
Events
drag
- Source:
拖拽中触发
Parameters:
| Name | Type | Description |
|---|---|---|
vm |
VueComponent | MyDrag实例 |
start
- Source:
开始拖拽时触发
Parameters:
| Name | Type | Description |
|---|---|---|
vm |
VueComponent | MyDrag实例 |
stop
- Source:
结束拖拽时触发
Parameters:
| Name | Type | Description |
|---|---|---|
vm |
VueComponent | MyDrag实例 |