React-dnd: Nested drop targets and canDrop

Created on 29 May 2018  ·  3Comments  ·  Source: react-dnd/react-dnd

I have 2 nested DropTargets.
I want to prevent drop on child droptarget if the drop on parent drop target is disabled.
How can the canDrop() method of the child depend on the canDrop() method of the parent?
I didn't find a way to do that strictly with the current API, I had to rely on components.

Has anybody struggled with this?

Thanks!

wontfix

Most helpful comment

@danielrob how did you solve your problem with {shallow: true} ? I'm trying to use that in canDrop and it seems to have no effect. Ideally I would want the children to have priority when dropping, and then the parents.

All 3 comments

I came here initially because I had the opposite problem... which I solved with monitor.isOver({ shallow: true }) in the canDrop method of both parent and child. I wanted only the child to respond, but found the parent returning false prevented the child from returning true.

Thus I think the behaviour you're describing should be the default behaviour. I'm assuming both accept the same drop types, and that your actual dom elements don't have some wierd stacking issue going on, and that your canDrop isn't getting in the way.

Anyway, I'm not a contributor/collaborator, and just found your issue by chance. You may wish to post a sandbox of your issue, as this always helps library maintainers understand exactly your problem.

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

@danielrob how did you solve your problem with {shallow: true} ? I'm trying to use that in canDrop and it seems to have no effect. Ideally I would want the children to have priority when dropping, and then the parents.

Was this page helpful?
0 / 5 - 0 ratings