When :class is used in a nested dnd container, Vue removes the smooth-dnd-container class from the element and it's never put back on. This causes smooth-dnd to use the parent container as a reference for where to place the dropped element in the list.
Workaround: use a wrapper or child div to put the class on instead of putting it on the <container>
Repro link: https://codesandbox.io/s/vue-smooth-dnd-nested-bug-thwo5e
When
:class
is used in a nested dnd container, Vue removes thesmooth-dnd-container
class from the element and it's never put back on. This causes smooth-dnd to use the parent container as a reference for where to place the dropped element in the list.Workaround: use a wrapper or child div to put the class on instead of putting it on the
<container>