キャッチされない例外TypeError：プロパティを読み取ることができません '取得' 未定義のVueJs

Question

で

私は上記のコードを実行すると、私はコード

<div id="vue-instance"> 

</div> 

JS

var vm = new Vue({ 
    el: '#vue-instance', 
    data: { 
    }, 
    ready:function(){ 
    this.loadCountries(); 
    }, 
    methods:{ 
     loadCountries(){ 
      this.$http.get('https://restcountries.eu/rest/v1/all',function(data){ 
       console.log(data); 
      }) 
     } 
    } 
}); 

を以下している、それは誤り

次は私を与えます

Uncaught TypeError: Cannot read property 'get' of undefined

私はフィドルを持っています

JsFiddle

ヘルプはずっと

Answer 1

$http.getがVue Resourceからでいただければ幸いです。あなたが正しくpackage.jsonにvue-resourceを追加することでで、npm installを経由して、コードでそれをインストールすることを引っ張っていることを確認してください：

var Vue = require('vue'); 

Vue.use(require('vue-resource')); 

フィドルでこれを使用するには、コードに次の外部リソースや使用中vue-resourcecdn linkを追加する必要があります：

Vue.use(VueResource) 

作業のデモを参照してください：あなたはこれをVUEリソースのためのプラグインを持っていないのでhttps://jsfiddle.net/49gptnad/187/

Answer 2

を$ HTTPで定義されていません。 jue-fiddleでVue-resourceを追加するには、https://cdn.jsdelivr.net/g/vue@2.0.0-rc.4,vue.resource@1.0.0を外部スクリプトセクションに追加します。

Answer 3

$ httpを使用するには、vue-resourceミドルウェアを先にインストールする必要があります。次のコマンドを使用してインストールすることができます。

あなた main.jsファイルへの設置に行く後

npm install vue-resource --save 

とVUEリソースをインポート

import vueResource from 'vue-resource' 

今すぐそのので、インポート、我々はただの使用メソッドを呼び出す必要があり、次のようにVueこのミドルウェアで動作します。 の使用メソッドは、次のように呼び出すことができます。

Vue.use(vueResource) 

Answer 4

私は、次のモードのこの問題を修正：main.js

import Vue from './bootstrap' 
import BootstrapVue from 'bootstrap-vue' 

Vue.use(BootstrapVue) 

で

npm install bootstrap-vue --save 
npm install vue-resource --save 

アプリで

import Vue from 'vue' 
import VueResource from 'vue-resource' 

Vue.use(VueResource) 

export { Vue } 

bootstrap.jsを作成します。vue

this.$http.get('/api/module/all').then(...