Drag and Drop not triggering rerender | xyflow | Page 1

dusky seal Apr 15, 2025, 6:02 PM

#

In this ReacFlow App, the goal is for the two flows to alter a table.
In FlowStates the goal is that when a node is created with onDrop it will increase numberOfStates with its setter. This is not the case:

First node created with DnD shows first and correct numberOfStates.
Subsequent DnD nodes show the same numberOfStates as the first one.
Changing panel seams to trigger the update and the next numberOfStates would be the updated one.

Goal:

How to trigger the update so the next DnD node has the correct value without needing to change panel to trigger it.

#

This is App.jsx file:

📎 App.jsx

meager ore Apr 15, 2025, 6:10 PM

#

In the onDrop function, pass the numberOfStates as a param in dependency array of useCallback.

dusky seal Apr 15, 2025, 6:40 PM

#

That was so simple, but it went right over my head. Thank you very much.

meager ore Apr 15, 2025, 6:44 PM

#

no problem. Install the eslint extension in whatever text editor you are using. That would help you to catch issues like these.

lunar gale Apr 25, 2025, 11:24 PM

#

Are you talking about the rule-of-hooks plugin for eslint, or something else?

#Drag and Drop not triggering rerender