why i can not update data using vuex module?

108 Views Asked by At

here is my component

     methods:{
         ...mapActions(['udpateUsers']),
         Update(userID){
             let formData = new FormData();
             formData.append('new_name',this.editUser.new_name);
             formData.append('_method', 'PUT');      
             let config = {
                 headers:{
                     'Content-Type':'multipart/form-data',         
                 }        
             }
             this.udpateUsers(userID,formData,config);
         }

when i click update button the formData can not be sent to the server but when i console it the FormData is has all the fields

here is my modules

        mutations:{
             ADD_USER: (state,response)=>{
                 state.Users = response;
             },
             UPDATE_USERS: (state,response)=>{
                 state.Users = response;
             }
         },
         actions:{
             udpateUsers: ({commit},userID,formData,config)=>{  
                     http.put("/admin/update/"+userID,formData,config)
                     .then((response)=>{
                         commit("UPDATE_USERS",formData);  
                         console.log(response);
                     })
                     .catch((error)=>{
                         console.log(error.response);
                    })
             }
         }
     export default auth

i think the error will be my commit mutation

1

There are 1 best solutions below

16
On

You can't pass multiple parameters as payload to Vuex Actions. You'll need to wrap it all up in an object and pass it as a single param.

udpateUsers: ({commit}, { userID, formData, config }) => {
    // send to backend
}
this.udpateUsers({ userID, formData, config });

EDIT: From comments, it seems that you're using PUT method instead of POST in your VueX implementation, which is why your backend wasnt getting the data.