https://github.com/maixing/react-ultra-drag

react drag
https://github.com/maixing/react-ultra-drag

drag react redux

Last synced: 28 days ago
JSON representation

react drag

• Host: GitHub
• URL: https://github.com/maixing/react-ultra-drag
• Owner: maixing
• Created: 2018-01-11T09:19:44.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2020-02-15T10:48:30.000Z (almost 5 years ago)
• Last Synced: 2024-12-05T23:15:16.778Z (about 2 months ago)
• Topics: drag, react, redux
• Language: JavaScript
• Homepage:
• Size: 52.7 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
### Installing

$ npm install react-ultra-drag -save

### Exports

The default export is 

```

    import UltraDrag from 'react-ultra-drag';

```

### [Demo](https://maixing.github.io/drag/index.html#/)

### Example

```

    import React from 'react';

    import ReactDOM from 'react-dom';

    import UltraDrag from 'react-ultra-drag';

    const backgroundColor = {

        backgroundColor: 'rgba(255, 255, 255, 0.5)'

    };

    class App extends React.Component {

        constructor(props) {

            super(props);

        }

        onChange(rect){

        }

        getResizeIcon(){

            return 


        }

        render() {

            return (

                


                    


                    

                     {

                            this.dragcp = component;

                    }}>

                    

                

            );

        }

    }

    ReactDOM.render(, document.getElementById('main'));

```


### API

```js

//default=1,Scale remains the same as the parent element

scale:number                 

//default=true,Is it allowed to drag and drop     

enableDrag:boolean           

//Position or size change callback function,return currentRect 

onChange:function           

// React Component,define drag icon  

resizeIcon:component        

//is a boundary,{left:0,top:0,width:0,heigh:0}

bound:object                   

//drag icon size default 10   

dragSize:number              

//return currentRect  

getBounder:function          

//update bound

updateBound:function		              

//move callback

onMove:function		                      

//is true,can drag

clicked:boolean                          

//is true,grouped      

groupSeleced:boolean                     

```

### NOTES

    *parent container is fied or relative or absolute