react-dnd / react-dnd

Drag and Drop for React

Home Page:http://react-dnd.github.io/react-dnd

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Preview is not working for the first drag

psyycker opened this issue · comments

Hi!

I have the following piece of code:
Screenshot 2023-11-17 at 16 44 27
(I put a screenshot as you can see the types as well)
It is a simple react component with a header (which is the grabbing source) and the whole container being set as the preview.

However, when trying to do the first grab, the preview won't work. It'll only work the second time I grab:
https://github.com/react-dnd/react-dnd/assets/9397742/4ea64b0d-d189-4cff-9d04-cc522d7aa7a4

The component is using useGrab in the most simple way like this:
Screenshot 2023-11-17 at 16 48 45
I followed the tutorial on the website and cannot see anything I missed.

Desktop (please complete the following information):

  • OS: MacOS Latest version
  • Chrome
  • Version 119

The way you do it here you are both rendering the div and the component.

The final return statement should look like this:

return isDragging ? (<div ref={preview} />) : (<Component ref={drag} />)

@johndalloxx it's impossible to return both the div and the component.
When doing the first return, the execution stops.