rd

react-dragdrop

ReactJS DragDropMixin

Showing:

Popularity

Downloads/wk

2

GitHub Stars

7

Maintenance

Last Commit

6yrs ago

Contributors

1

Package

Dependencies

0

Size (min+gzip)

0.1KB

License

MIT

Type Definitions

Tree-Shakeable

No?

Categories

Readme

React DragDropMixin

Build Status

A lightweight DragDropMixin for ReactJS components

Installation

Simply download the package

npm install react-dragdrop --save

Usage

  • Include the mixin in the components
  • Create a dragDrop function to define configuration
mixins: [DragDropMixin],
dragDrop: function () {
    return {
        // configuration goes here
    };
},

When configuring a draggable item

    return {
        draggable: true, // Allow dragging
        dropType: 'myItem', // Define type to be used in droppable item
        dataTransfer: { myItemData: property } // Data to pass to droppable item
    }

When dropping an item

    return {
        droppable: true, // Allow  dropping
        acceptableDrops: ['myItem'], // Type of draggables to allow
        drop: function (myItem) {} // Callback to execute when dropping
    };

License

MIT. See LICENSE for more info.

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100
No reviews found
Be the first to rate

Alternatives

No alternatives found

Tutorials

No tutorials found
Add a tutorial