Nested example with Vuex throws error when nesting, but not when reordering top level

[jifka]

I've followed the example using a Vuex store for elements, and implemented a getter/setter for the list that reads/writes the store. This is in the outermost component holding the top-level nested vue. The v-model is assigned to the afformentioned list.

This works properly if the list is flat and items can be dragged to reorder.

But as soon as you attempt to drag an item within another to create a hierarchy, the standard error is thrown: "[vuex] do not mutate vuex store state outside mutation handlers."

I can't seem to figure out how to catch an attempt to add/remove child elements in order to update the store using commit or dispatch.

[JamieGarcia123]

v-model should not be used for updating the store.... i know i have this issue too and havent tried to resolve while using this component in other items of my web app i have used :value instead and got rid of the error

[jakecjones]

Having the same issue, :value has some strange behavior too. It starts duplicating items 🤷‍♂️

[jakecjones]

Check out the potential solution from issue #701