codecamp

React EasyUI 拖动

属性列表

名称 数据类型 作用描述 默认值
scope string 拖动范围。 null
disabled boolean 为True时,禁用拖动。 false
handle Element, selector 启动可拖动的手柄。 null
revert boolean 如果设置为true,当拖动停止时,该元素将返回到初始位置。 false
deltaX number 拖动的元素位置x与当前光标对应。 null
deltaY number 拖动的元素位置y与当前光标对应。 null
edge number 开始拖动的拖动宽度。 0
delay number 以毫秒为单位定义启动拖动操作的延迟时间(以毫秒为单位)。 100
axis string 定义被拖动元素移动的轴, 可选值为“v”或“h”,当设置为null时,将沿“v”和“h”方向移动。 null
cursor string 拖动时的css光标。 move
proxy DraggableProxy 拖动时使用的代理组件。 null

事件列表

名称 参数 作用描述
dragStart state 开始拖动时触发。
drag state 拖动放置。
dragEnd state 当拖动结束时触发。

注:
- 继承: None 。

使用方法

<div v-Draggable="{drag:onDrag}" :style="dragStyle">
    <p style="text-align:center">Drag Me</p>
</div>
React EasyUI 基本列表
React EasyUI 放置
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

React EasyUI 教程总览

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }