• Draggable 拖拽
    • Variables
    • Events

    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尺寸发生变化的回调-