可以行动vuex内没有访问VUE资源

Question

嘿，大家好我试图做我的vuex侧动作里面的请求，我得到这个错误：

Cannot read property '$http' of undefined 

设置我的VUE资源这样在我的main.js文件：

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

这是问题的一个合适的解释，即$http不vuex https://stackoverflow.com/a/42571288/6355502

状态只能在基因突变改变中访问。不在行动中。只需从动作中提交一个突变来改变状态。

昨天晚上我试了同样的错误消息，强迫我在触发突变的操作中执行异步提取。你不能在突变中进行异步操作，并且你不能在动作中改变状态，所以你必须分割代码。

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

// in mutations 
setTableStyles(state, payload){ 
state.tableStyles = payload; // or state.tableStyles.push(...payload) if tableStyles is an Array 
}