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

170
Vistas
Vue parece estropear el evento dragend cuando los elementos HTML cambiaron como resultado del arrastre

Estoy trabajando en una aplicación que usa la biblioteca vuedraggable ( https://github.com/SortableJS/vue.draggable.next ). Mis matrices entre las que se pueden arrastrar los elementos se calculan según la propiedad ordenada de una gran matriz reactiva de todas las "tareas".

Cuando arrastra algún elemento, arrastrable lo mueve entre esas matrices "temporales". Eso se detecta y como resultado se edita la propiedad "assignee" de las tareas. Esto da como resultado que la propiedad calculada se recalcule y la interfaz de usuario se actualice. Esto funciona bien. El problema es que probablemente como resultado de este diseño de interfaz de usuario después de arrastrar. Cuando engancho el evento @dragend en un elemento que se puede arrastrar, se dispara en el elemento en lugar de donde el arrastre comenzó a estropear muchas cosas.

Cronología:

 ------- ------- | el1 | | el3 | ------- ------- ------- | el2 | -------
  1. Comienzo a arrastrar el1 debajo de el3
  2. Arrastre los extremos, ambas matrices a partir de las cuales se generan las columnas se recrean (porque son propiedad computada).
  3. @dragend se dispara pero se dispara en el2 en lugar de arrastrar el1

Lo mismo sucede con otros eventos como mouseenter. Desafortunadamente, como tengo mouseenter enganchado a la información sobre herramientas personalizada, hace que esta información sobre herramientas se muestre con datos incorrectos (datos el2 en lugar de el1 donde realmente está el mouse). Este estado permanece hasta que se mueve el mouse (incluso si solo 1px). En ese momento, mouseenter se dispara nuevamente en el1 y se abre la información sobre herramientas correcta.

Desafortunadamente, no sé dónde podría crear una reproducción que podría usar lib arrastrable :-(

Hay un "truco" que ayuda a ocultar este comportamiento. En @dragend establece el indicador que ignora el único @mouseenter en el2. En ese caso, no se muestra nada después de que finaliza el arrastre y solo se abre la información sobre herramientas adecuada cuando se mueve el mouse.

about 4 years ago · Juan Pablo Isaza
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