[Vuejs]-Vuex with axios call, context is unknown when the promise resolves

0👍

This will work for sure.

getUserDataList (context) {
  const url = "http://example.com/api/FetchSomeData"

  axios
  .get(url, {
    params: {
      id: context.state.userId,
      password: context.state.userPwd
    },
    headers: {
      myapikey: '12345'
      myappkey: '678910'
    }
  })
  .then(function (response) => {
    context.commit('myMutation', response.data.data)  
  })
  .catch(function (error) {
    console.log(error)
  })
}

And maybe your solution with destructuring assignment will work too, but try change the arrow function in .then() to classic function. So this:

.then( (response) => {
  commit('myMutation', response.data.data)  
})

to this:

.then(function (response) => {
  commit('myMutation', response.data.data)  
})

0👍

The code you posted seems to be right. Are you calling the action like this: store.dispatch(‘getUserDataList’)?

0👍

Thanks for you answers and help, but I solved the problem. It seems I had the import statements at the top of the store.js file in the wrong order. I’m not even sure what I started with, but this is whats working now …

import Vue from ‘vue’

import Vuex from ‘vuex’

Vue.use(Vuex);

import axios from ‘axios’;

Problem solved!
Thanks again.

Leave a comment