Z F %!s(int64=7) %!d(string=hai) anos
pai
achega
bc4eea13ad
Modificáronse 2 ficheiros con 9 adicións e 71 borrados
  1. 6 71
      src/lib/dragger/index.tsx
  2. 3 0
      src/lib/dragger/type.ts

+ 6 - 71
src/lib/dragger/index.tsx

@@ -1,74 +1,9 @@
 import * as React from "react";
-import { int, innerHeight, innerWidth, outerHeight, outerWidth, parseBounds, Bound } from '../utils'
-
+import { int, innerHeight, innerWidth, outerHeight, outerWidth, parseBounds } from '../utils'
+import { DraggerProps } from './type';
 
 const doc = document
 
-
-
-interface DraggerProps {
-
-    className?: string;
-
-    /**
-    * 给予元素一个x,y的初始位置,单位是px
-    */
-    x?: number,
-    y?: number,
-
-    /** 
-     * 拖动范围限制
-     * 如果不规定范围,那么子元素就可以随意拖动不受限制
-     * 1.可以提供自定义的范围限制
-     * 2.也可以提供父类为边框的范围限制(string === parent)
-     */
-    bounds?: Bound | 'parent',
-
-    /**
-         * 以网格的方式移动,每次移动并不是平滑的移动
-         * [20,30],鼠标x轴方向移动了20 px ,y方向移动了30 px,整个子元素才会移动
-         */
-    grid?: [number, number],
-
-
-    /**只允许移动x轴 */
-    /**只允许移动y轴 */
-    allowX?: Boolean,
-    allowY?: Boolean,
-
-
-    /**
-    * 是否由用户移动
-    * 可能是通过外部props改变
-    */
-    isUserMove?: Boolean,
-
-    /**
-     * 生命周期回调
-     */
-    onDragStart?: (x: number, y: number) => void,
-    onMove?: (event: MouseEvent | TouchEvent, x: number, y: number) => void,
-    onDragEnd?: (event: MouseEvent | TouchEvent, x: number, y: number) => void,
-
-    onResizeStart?: (event: any, x: number, y: number) => void,
-    onResizing?: (event: MouseEvent | TouchEvent, x: number, y: number) => void
-    onResizeEnd?: (event: MouseEvent | TouchEvent, x: number, y: number) => void
-
-    style?: React.CSSProperties,
-
-    w?: number,
-    h?: number,
-
-    handle?: Boolean;
-
-    canDrag?: Boolean;
-
-    canResize?: Boolean;
-
-    children: (provided: any, resizeMix: any, dragMix: any) => any;
-}
-
-
 export class Dragger extends React.Component<DraggerProps, {}> {
     parent: any;
     self: any;
@@ -207,7 +142,7 @@ export class Dragger extends React.Component<DraggerProps, {}> {
         /** 保证用户在移动元素的时候不会选择到元素内部的东西 */
         doc.body.style.userSelect = 'none'
 
-       
+
 
         // if (event.target.id !== 'dragact-handle') return
 
@@ -244,11 +179,11 @@ export class Dragger extends React.Component<DraggerProps, {}> {
             this.self = event.currentTarget
         }
 
-       
+
 
         this.props.onDragStart && this.props.onDragStart(this.state.x, this.state.y)
 
-        
+
         let originX, originY;
         if (event.type.indexOf('mouse') >= 0) {
             originX = (event as MouseEvent).clientX
@@ -258,7 +193,7 @@ export class Dragger extends React.Component<DraggerProps, {}> {
             originY = (event as TouchEvent).touches[0].clientY
         }
 
-        
+
 
         this.setState({
             originX: originX,

+ 3 - 0
src/lib/dragger/type.ts

@@ -53,6 +53,7 @@ export interface DraggerProps {
     onResizing?: (event: MouseEvent | TouchEvent, x: number, y: number) => void
     onResizeEnd?: (event: MouseEvent | TouchEvent, x: number, y: number) => void
 
+
     style?: React.CSSProperties,
 
     w?: number,
@@ -63,4 +64,6 @@ export interface DraggerProps {
     canDrag?: Boolean;
 
     canResize?: Boolean;
+
+    children: (provided: any, resizeMix: any, dragMix: any) => any;
 }