Draggable 拖拽

用该组件包裹后可以变成拖拽组件

TIP

1.0.9+

Draggable 拖拽 - 图1

  1. <div style="position:relative;height:400px;">
  2.   <div class="avue-grid"></div>
  3.   <avue-draggable >
  4.     <div style="width:200px;height:200px;background:red">
  5.     </div>
  6.   </avue-draggable>
  7. </div>
  9. <script>
  10. export default {
  11.   data() {
  12.     return {
  14.     }
  15.   },
  16.   methods: {
  18.   }
  19. }
  20. </script>

Variables

参数说明类型可选值默认值
disabled是否禁止拖动—false
width元素的宽度——
height元素的高度——
top元素的x位置—0
left元素的y位置—0
z-index图层的序号-1

Events

事件名说明参数
focus聚焦时的回调-
postion位置发生变化的回调-
blur失去焦点的回调-
change任意参数改变的回调-
resize尺寸发生变化的回调-