Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

222
Views
function messes order up when hovering over item using drag and drop react-dnd

I have this really annoying issue, where a function runs twice and messes everything up because of it.

I have created a drag and drop, and I do that for tasks in stages. You can move a task around within a stage, but also move from one stage to another. The function is built the way that, if start item and and destination item are start < item <= destination then the items between will move their order number -1, if it is start > item >= destination then it is +1, all other instances it is +0, so not updated at all.

Now the issue is, the while I am moving one item to another item, the function runs. on the first run, it is updated corecctly, but on the second run, it takes the updated values and updates them again

So if I have this array [1, 2, 3] and I move 1 to 3, they should update like that

1 -> 3 (becomes destination order, so 3)
2 -> 1 (is start < current <= destination, so 2 - 1)
3 -> 2 (is start < current <= destination, so 3 - 1)

But then it updates again, and the end result is like this

1 -> 3 -> 3
2 -> 1 -> 0
3 -> 2 -> 1

or something like this

1 -> 3 -> 3
2 -> 1 -> 0
3 -> 2 -> 0

wherer two items have the same order, or another value, like -1. It is very annoying and messing everything up. I have no idea how to correct this behaviour.

Sandbox: https://codesandbox.io/s/drag-and-drop-order-issue-ikhyo?file=/src/Task.store.js:2195-2265 You can play around in the preview, the drag and drop works, but with the issue described above.

Function is found in Task.store.js:88

One guess that I have, is that while I am still holding the item, it also still holds the state it originally had.

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!