Vue-resource: Cannot read property 'get' of undefined

Created on 13 Mar 2017  路  14Comments  路  Source: pagekit/vue-resource

Cannot read property 'get' of undefined

Most helpful comment

I had the same issue with 1.3.1+, importing the module with require('vue-resource').

Changing the logic to:

var Vue = require('vue/dist/vue')

import VueResource from 'vue-resource';
Vue.use(VueResource);

is working with 1.3.3. I am using webpack with vue-loader, some typescript with vue-ts-loader.

All 14 comments

Same here, while using this.$http.get.
But it works when I use Vue.http.get

make sure what's the this refer to

Same here, I fallback to version 1.0.3

I think this issue should be closed because it's not a problem of vue-resource

I had the same problem, but as @loveLibra says all depends on the context, in my case was the way I was getting available vue-resource in VueJS, check in your app.js how are you importing it.

@willworks If you can provide more details on how are you calling the get method and the context it would be better to get a hint to resolve your problem.

@chespinoza

const resource = require('vue-resource');
App.use(resource);

and I call vue-resource like this as usual, but it failed when I update to the lastest version
this refer to the vm instance

this.$http.get

but when I use axios like this, and it works well

const axios = require('axios');
Vue.prototype.$http = axios;
this.$http.get

I'm having the same issue.
I setup it in main.js in my webpack app.

const VueResource = require('vue-resource')
Vue.use(VueResource)

Then inside the VueComponents I do this.http or this.$http and both are undefined.
I also tried to import Vue import Vue from 'vue' and try to use Vue.http and Vue.$http, but both are still undefined.
I tried to include the script in the index.html instead but it doesn't work either.

I'm having the same issue. version 1.3.1
Version 1.3.0 - working!

I had the same issue with 1.3.1+, importing the module with require('vue-resource').

Changing the logic to:

var Vue = require('vue/dist/vue')

import VueResource from 'vue-resource';
Vue.use(VueResource);

is working with 1.3.3. I am using webpack with vue-loader, some typescript with vue-ts-loader.

Confirm what @arvidkahl wrote.

To fix the problem change var Vue = require('vue/dist/vue') into import VueResource from 'vue-resource'

I just needed to use these two extra lines

import VueResource from 'vue-resource'
Vue.use(VueResource)

it's import Vue from 'vue'
not import Vue from 'Vue'

I am using Visual Studio Code and when I did

import VueResource from 'vue-resource'
Vue.use(VueResource)

I've got

Argument of type '(vue: VueStatic) => void' is not assignable to parameter of type 'PluginObject<any> | PluginFunction<any>'.
  Type '(vue: VueStatic) => void' is not assignable to type 'PluginFunction<any>'.
    Types of parameters 'vue' and 'Vue' are incompatible.
      Type 'VueConstructor<Vue>' is not assignable to type 'VueStatic'.
        Property 'http' is missing in type 'VueConstructor<Vue>'.

If you inited the Vue object and in that file you gonna send requests with Vue Resource, first you import it:

import VueResource from 'vue-resource'

and then there you should use this.$http.get, because it looks like you calling it in a global form.
But when you wanna use it in the components or something, you should first require it, and then use it:

import VueResource from 'vue-resource'
Vue.use(VueResource);

Vue.http.get('address');

@mrcat323 's answer works for me! It seems that Vue 2.5.2 ( I am currently using ) doesn't use vue-resource as the default this.$http variable.

Was this page helpful?
0 / 5 - 0 ratings