Question

我在我的商店（Vuex商店）的操作对象中调用了一个宁静的服务。调用工作正常，我在promise中返回给我的数据，但传递到顶部函数的上下文在“then”函数内无效。我无法提交数据，因为提交无效，状态无效......似乎axios在完全不同的上下文中运行。 Axios导入到store.js文件的顶部，程序构建并运行时没有其他错误。任何帮助将不胜感激。

这是我的函数:(此函数位于我的vuex商店的actions对象中）

getUserDataList( {commit,state} ) {

  const url = "http://example.com/api/FetchSomeData";

  axios.get(url, {
      params: {
        id: state.userId,
        password: state.userPwd
      },
      headers: {
        myapikey: '12345'
        myappkey: '678910'
      }
    })
    .then( ( response ) => {
       console.log("Response:", response.data.data);
         (data is returned here, is working fine)

       // **** PROBLEM HERE! *****
       //   commit is undefined
       //   state is undefined
       // ************************    
       commit('myMutation', response.data.data)  
   })
    .catch(function(error) {
      console.log(error);
   })

}

Answer 1

这肯定会有用。

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)
  })
}

也许您的解构分配解决方案也会起作用，但请尝试将.then（）中的箭头函数更改为经典函数。所以这个：

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

到此：

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

Answer 2

您发布的代码似乎是正确的。你是否正在调用这样的动作：store.dispatch（'getUserDataList'）？

Answer 3

感谢您的回答和帮助，但我解决了这个问题。看来我在store.js文件的顶部以错误的顺序输入了import语句。我甚至不确定我的开始，但这是什么工作现在......

从＆＃39; vue＆＃39;

导入Vue

从＆＃39; vuex＆＃39;

导入Vuex

Vue.use（Vuex）;

从＆＃39; axios＆＃39;;

导入axios

问题解决了！再次感谢。

具有axios调用的Vuex，当promise结算时，上下文是未知的

3 个答案: