I'm trying to fire off redux actions that help track various DnD states globally. I need to know if dragging is happening and what type of target (ideally exactly which target) is being hovered. Detecting dragging is easy enough using the Source's spec, but I can't figure out how to detect hovering on a target. It has the 'hover' method in the spec, but that fires continuously, and as far as I can tell there isn't a way to tell when the hover stops. I could use timeouts but that seems less than ideal. I had thought to wrap the main app area in a dropTarget and use 'shallow' checking, but that doesn't give info about what type of drop target is being hovered. I suspect theres some way I could exploit the DnD Context but haven't dug in that far.
Might be able to bind my own onDrag*
events to do what I need. Adds a slight interdependence between my app code and react-dnd
, in terms of assumptions about which drag backend I'm using. But probably fine.
You can use componentWillReceiveProps
lifecycle methods and fire an action when nextProps.isOver !== this.props.isOver
. You’d need to add isOver: monitor.isOver()
to your DropTarget
’s collect()
function.
Most helpful comment
You can use
componentWillReceiveProps
lifecycle methods and fire an action whennextProps.isOver !== this.props.isOver
. You’d need to addisOver: monitor.isOver()
to yourDropTarget
’scollect()
function.