Vue.draggable: Nestable with VueX

[krodelabestiole]

Hello, I am having a hard time writing a tree manager.

A JSFiddle is worth a thousand words : https://jsfiddle.net/bestiole/pmvwhwcq/

It's half working, but the recursive behavior has been pretty hard to implement with vuex, and I had to pass through the dirty solution of keeping a _path_ from one _tree_ component parent to a child, and of using this pretty dirty _eval_ functions.

Now you can observe the main issue by dragging and dropping _article 1_ right after _about_.

I guess the issue comes from the fact that the sender component still uses the former path value while the recipient list has already updated its indexes.

Now I am stuck, and I mainly wondering if there would not be a whole better approach to my project ?
I am pretty new to VueJS and some guru's knowledge would be much appreciated there !

Thanks a lot !

[krodelabestiole]

alright, it seems I fixed the issue by implementing a _findDeep_ function when getting or setting the list from the store : https://jsfiddle.net/bestiole/pmvwhwcq/53/

I guess this solution might be a bit heavier to process but it get rid of the _path_ variable and the infamous _eval_ function.

Now I will try to find an ergonomic way to create new children in any node.

I close this issue though it would be nice to have a complete example of a working Nestable Vue.Draggable + VueX implementation in the documentation.