clauderic / react-sortable-hoc

A set of higher-order components to turn any list into an animated, accessible and touch-friendly sortable list✌️
https://clauderic.github.io/react-sortable-hoc/
MIT License
10.77k stars 978 forks source link

Dispatch state before drag starts is taking effect only when the mouse is released. #873

Open diegoulloao opened 1 year ago

diegoulloao commented 1 year ago

There is a prop updateBeforeSortStart that's useful for run asynchronous code before dragging. I need to call a setState before the drag starts, which changes some things on the list.

The issue: For some reason the set state dispatcher is being called and I can see the new state value correctly in the console but it doesn't take effect in the ui until the dragged row (mouse) is released, so all changes are reflected after dragging.

How can I prevent this? I really need to see this state changes reflected in the ui before dragging starts.

This state that I need to dispatch is in charge of collapse some parents (tree list) before drag.

Is this an issue? What can I do?

grayJellyFish commented 1 year ago

this is happening for me too. seems like it might be due to automatic batching in react 18. Any pointers on what could be the fix here?

diegoulloao commented 1 year ago

Finally we decided to move to react-dnd, it works pretty good.