无法访问动作vuex中的vue资源

Question

大家好，我正在vuex一侧的动作中尝试执行一个请求，但出现此错误：

Cannot read property '$http' of undefined

我在main.js文件中以这种方式设置vue资源：

import Vue from 'vue'
import VueResource from 'vue-resource'
import VueRouter from 'vue-router'
import App from './App.vue'
import {routes} from './routes';
import {store} from './store/store';
import VModal from 'vue-js-modal'

Vue.use(VModal)
Vue.use(VueResource);
Vue.use(VueRouter);

const router = new VueRouter({
  routes
});

new Vue({
  el: '#app',
  store,
  router,
  render: h => h(App)
})

然后在商店：

addStyle(state,newStyleObj) {
    console.log(newStyleObj);
    var vm = this;
    this.$http.post('http://localhost:16339/api/Styles/PostStyle/', newStyleObj)
        .then(response => {
            state.tableStyles = response.body;
            console.log(state.tableStyles)
            console.log(response.body)
        }, error => {
            console.log(error);
        });
}

有什么帮助吗？

Answer 1

您可以使用 this._vm 从商店访问 Vue 实例。

this._vm.$http.post()

Answer 2

import axios from 'axios'
import Vue from 'vue'
import Vuex from 'vuex'

const axiosInstance = axios.create({
    baseURL: '',
    withCredentials: true,
})

Vue.prototype.$axios = axiosInstance
Vuex.Store.prototype.$axios = axiosInstance

这对我有用。

现在，您可以this.$axios在Vue和Vuex中通过进行访问。