web-dev-qa-db-ja.com

axiosはvue js cliで定義されていません

npm install axiosコマンドを使用してaxiosをインストールしました。これは私のpackage.json依存関係です

 "dependencies": {
    "axios": "^0.18.0",
    "bootstrap-vue": "^2.0.0-rc.11",
    "vue": "^2.5.2",
    "vue-router": "^3.0.1"
  },

main.jsファイルにaxiosを登録しました。

import Vue from 'vue'
import VueRouter from 'vue-router'
import BootstrapVue from 'bootstrap-vue'

import axios from 'axios'
import App from './App'
import routerList from './routes'

Vue.use(axios)
Vue.use(BootstrapVue)
Vue.use(VueRouter)

コンポーネントの1つでaxiosを使用しようとすると、次のエラーが表示されます。

Uncaught ReferenceError: axios is not defined

これを修正する方法は？

javascriptvue.jsvuejs2axios
11
Beginner

Vue.useは、プラグインを追加することを意味します。ただし、axiosはVueのプラグインではないため、useを介してグローバルに追加することはできません。

私が推奨するのは、axiosを必要なときにだけインポートすることです。しかし、本当にグローバルにアクセスする必要がある場合は、プロトタイプに追加することができます。

Vue.prototype.$axios = axios

その後、this.$axiosを使用してvueのaxiosにアクセスできます

25
user3003238

また、vue-axiosをインストールし、main.jsにインポートします

import VueAxios from 'vue-axios'

次にmain.jsで：

Vue.use(VueAxios, axios)

今、私があなたの方法を間違えていなければ、例えばあなたが使うことができます：

let uri = 'http://localhost:4000/tickets/add';
this.axios.post(uri, this.ticket).then((response) => {
    console.log(response);
});
4
user3918528
import Vue from 'vue'
import axios from 'axios'

Vue.prototype.$http = axios;

コンポーネント内で、次のようなaxiosの使用を開始できます。

{
    methods: {
        someMethod() {
            this.$http.get('/users').then(() => {
                // do something
            })
        }
    }
}
2
Julian Paolo Dayag

次のコマンドを使用してnpmをインストールします

 npm install axios --save

上記のコマンドインポートを以下のように実行した後：

import axios from 'axios'
0
Ajay

このコードを試してください：

import axios from 'axios'
    Vue.use(axios)
0
John

myprojectに挿入すると、laravel project window.axios = require('axios');で見つかりました。それはすべて大丈夫です！

0
Mike