IAM在使用vuedragable库（）。我之间可以拖动元素之间的数组是从所有“任务”的一个大反应阵列中计算出的属性。
当您拖动一些元素时，可拖动将其移动到那些“临时”数组之间。检测到这一点，结果任务属性“受让人”被编辑。这会导致重新计算的计算属性并刷新UI。这效果很好。问题可能是由于该UI布局在拖动之后。当我在拖动元素上挂钩@Dragend事件时，它会在元素上触发，以代替拖动开始弄乱许多事情。
时间轴：
------- -------
| el1 | | el3 |
------- -------
-------
| el2 |
-------
- 我开始在EL3拖动末端拖动EL1
- ，重新创建了生成列的两个数组（因为它们是计算属性）。
- @Dragend被触发了，但它在EL2上发射，而不是实际拖动EL1，
例如Mouseenter等其他事件也会发生。不幸的是，由于我将Mouseenter挂钩以自定义工具提示，因此该工具提示显示错误的数据（EL2数据而不是鼠标实际所在的EL1）。该状态一直保持在移动鼠标之前（即使仅1PX）。那时，MouseEnter再次在EL1上触发，并打开正确的工具提示。
不幸的是我不知道可以在哪里创建可以使用可拖动的lib :-(
有一个“黑客”有助于隐藏此behaiour。末端，只有在移动鼠标时才能打开适当的工具提示。
Iam working on app which is using vuedraggable library (https://github.com/SortableJS/vue.draggable.next). My arrays between which elements can be dragged are computed property sorted from one big reactive array of all "tasks".
When you drag some element, draggable moves it between those "temporary" arrays. That is detected and as a result tasks property "assignee" is edited. This results in computed property being recalculated and UI is refreshed. This works well. Issue is that probably as result of this UI layouting after drag. When i hook @dragend event on draggable element it is fired on element in place of on where dragging started messing many things up.
Timeline:
------- -------
| el1 | | el3 |
------- -------
-------
| el2 |
-------
- I start dragging el1 under el3
- Drag ends, both arrays from which columns are generated are recreated (because they are computed property).
- @dragend is fired but it fires on el2 instead of actually dragged el1
Same happens with other events like mouseenter. Unfortunatelly as i have mouseenter hooked to custom tooltip it makes this tooltip show with wrong data (el2 data instead of el1 where mouse actually is). This state remains until mouse is moved (even if 1px only). At that point mouseenter is fired again on el1 and correct tooltip is opened.
Unfortunatelly i dont know where i could create repro which could use draggable lib :-(
There is one "hack" which helps hiding this behaiour. In @dragend set flag which ignores single @mouseenter on el2. In that case nothing is shown after drag ends and only when mouse is moved proper tooltip is opened.
发布评论