Vue-resource: this is undefined (this.$http.get) in vuex 2.0 actions

[windows1087]

I try to migrate my vue 1.0 to 2.0 and it is really hard...many undocumented changes :(

So, here is another:

This is my actions.js file

import Vue from 'vue';
import Resource from 'vue-resource';

Vue.use(Resource);

export fetchData({commit}, filter) {
  // bla bla
  this.$http.get(...)
};

I tried Vue.$http.get or Vue.root.$http.get but nothing works...

// Edit: Ok Vue.http.get works, but why does this.$http.get not more works?

[Binaryify]

you can try this

import Vue from 'vue'
import VueResource from 'vue-resource'
Vue.use(VueResource)
Vue.http.options.emulateJSON = true
const http=Vue.http
export default http

[liuhedong]

import Vue from 'vue';
........
Vue.http.get(....).....

is work!!!

[dmr07]

Both Vue.http.get and this.$http.get are giving me undefined.

[davidlin504]

vue.js version 2.1.0 not works well

Why did you close this issue ?

http://jsfiddle.net/rrd7k8hp/

[steffans]

See http://jsfiddle.net/rrd7k8hp/1/

[czerasz]

I thought, after reading this comment, that Vue.http will not work with interceptors:

Interceptors can be defined globally and are used for pre- and postprocessing of a request. If a request is sent using this.$http or this.$resource the current Vue instance is available as this in a interceptor callback.

But to my surprise using Vue.http in actions works well with interceptors :smiley:

[Neko80]

You need to put
Vue.prototype.$http = axios;
in app.js, after
require('./bootstrap);'

[nmihaica]

After similar issues, I tried to find best practices and found
Fetching data from API through vuex-actions

You noticed that there is self.filteruser() method after commit. That is crucial moment. Before that we are committing a mutation, which is synchronous operation and we are sure that we will have our response in store.state that can be used in filterUsers() method (don't forget to pass self parm)

If you defined modules properly in main.js or app.js like others mentioned and followed given example you should be able to access self.$http.