Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

267
Vistas
Dnd-kit: active item loses order when dragged on Droppable

I'm facing a problem using @dnd-kit. The soring part works well (for example when I start dragging 1st element it obvioeulsy does sort), but when I reach a droppable element (green Thrash), the sorting breaks and the 1st element goes back.

You can see live demo here: link

Is there any way to fix this?

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

The problem was in handlers. When a dragged item reaches outside of the original drop area (a list), there is no more over-item under it. This is when the dragOver handler used to crash, since it relies on over.id internally

Solution: https://codesandbox.io/s/dndkit-grid-with-drag-handle-example-forked-w4j3sn

  1. Added checks for null and for id match
  2. Moved deletion logic to dragEnd handler
  3. Added state for dragged item reaching trash, so that list item can reflect it (becomes hidden)
  4. List item is hidden when dragged + new prop is true
  5. Moved Trash component out of original one, not critical tho
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda