Vue sortable not working properly

Question

I am working with vue-sortable and dragable and at the moment I can drag a item above and change its position, but my json doesn't get refreshed, so I have this list:

<draggable v-model="this.$store.getters.getDocument.getDocumentAttributes">
    <div class="panel panel-primary" v-for="(value, key, index) in this.$store.getters.getDocumentAttributes">
        <div class="panel-body quote">
            <span @click="removeSection(index,key)" class="pull-right glyphicon glyphicon-remove text-info"></span>
            <p>{{value.key}}</p>
        </div>
    </div>
</draggable>

I get the list from vuex store, I can swap the elements but the json doesn't refresh, how can I do it?

Answer 1

Your v-model is this.$store.getters.getDocument.getDocumentAttributes . It's vuex's getter things. Getter is just for getting data, you can't modify data with it.

Try to read the doc of the sortable lib: https://github.com/SortableJS/Vue.Draggable#with-vuex