CODEWITHSUNDEEP
reactjsreact-redux
Милош Рајковић
Милош Рајковић

Reputation: 293

How to return image to its original position using React-Draggable?

Can you please explain to me how to return the image to its original position after a drop? My image is inside a PopOver and I use library React-Draggable to move the image (https://github.com/mzabriskie/react-draggable), and I use it for an insert. So this is what happens to me after the insert, like it is shown in the picture:

some name

Can anybody has any solution for this? This is my code

import React, {PropTypes} from 'react';
import ReactDOM from 'react-dom';
import Draggable from 'react-draggable';

const PopOverForInsertingPL = ({portlet, onInsert}) =>{
    return (
        <Draggable onStop={() => onInsert(portlet)} grid={[25, 25]}>
            <div>
                <img src={require("./images/CustomizablePortletImage.png")}/> 
                <h3> {portlet.name} </h3> 
            </div>
        </Draggable>
    );
};

Upvotes: 0

Views: 395

Answers (1)

Милош Рајковић
Милош Рајковић

Reputation: 293

So the solution was to setState({open: false}) to a PopOver menu, so once the PopOver menu is closed, the image is returned to it's original position.

Upvotes: 1

Related Questions