vuedraggable with vuex module in laravel

Question

i want to use vuedraggable with vuex module in laravel for ordering the data in the table. so i want to pass the 'order' data of vuedraggable in server side. any one can help?

This is code in Vue js.

methods: {
        update() {
            this.testimonialsNew.map((testimonial, index) => {
                testimonial.order = index + 1;
            })

            axios.put('/updateOrder', {
                testimonials: this.testimonialsNew
            }).then((response) => {
                console.log(response.data)
            })
        }
    },

I want to do it in through vuex mutation

actions.....

updateOrder({commit,state}){
    state.users.map((user, index) =>{
        user.order = index + 1;
      });
    return new Promise((resolve, reject)=>{
        let params = _.cloneDeep(state.users)
        axios.put(APP_CONFIG.API_URL+'/updateOrder',{params:params})
        .then(response =>{
            console.log(response.data)
            resolve();
        })
        .catch(error =>{
            reject(error)
            commit('ERROR',error)
        });
    });
}

Error I get:

"function () { return this._data.$$state }": "Error: [vuex] Do not mutate vuex store state outside mutation handlers."

I have updated question. when i put array.map in actions i got Error in callback for watcher "function () { return this._data.$$state }": "Error: [vuex] Do not mutate vuex store state outside mutation handlers." — Dipesh Magar

Douglas Chen cdswyda Douglas Chen cdswyda · Accepted Answer · 2019-05-08T06:43:42

      state.users.map((user, index) =>{
        user.order = index + 1;
      });

At there, you modify Vuex's state. It should modify by mutations.

vuedraggable with vuex module in laravel

1 Answers