【Bug】Uncaught TypeError: Cannot read property 'element' of null

Github link

https://github.com/djkloop/vuedraggable-issuse-error.git

Step by step scenario

# Uncaught TypeError: Cannot read property 'element' of null

Actual Solution

# Dragging is normal for the first time, and an error will be reported when dragging back to the original position

Expected Solution

# Can't drag

[Spice-King]

I flipped it around and used tag="div" :component-data="{ as: 'transition-group' }" and it worked better.

Might not apply here since I’m on Vue 3.2 and Vue.Draggable.Next v4.1, but this thread did give the answers as to stuff about the fatherNode error, so I feel it’s at least worth punting here for the next person. If anyone wants to confirm it in the Vue 2 version, be my guest, I don’t have a Vue 2 app handy.

[quietmint]

I had the same issue when dragging between two lists if I use tag="transition-group" (but not when I use the default tag="div"). The error indicated that inserting the node failed, something about fatherNode being a text node (so it couldn’t access children).

I fixed it by using tag="transition-group" :component-data="{ tag: 'div' }" to cause <transition-group> to output an actual DOM element.