Vue.js: Axios is not working in Vue when calling an API

Question

Here is my code:

Main.js

import Vue from 'vue'
import App from './App'
import router from './router'
import axios from 'axios'

Vue.config.productionTip = false
var eventBus = new Vue();
Vue.prototype.$eventBus = eventBus;
Vue.prototype.$axios = axios;

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>'
})

Calling API

methods:{
    loginMethode(){
        console.log(this.user);
        this.$eventBus.$emit("loadingStatus",true);
        this.$axios.get('https://api.coindesk.com/v1/bpi/currentprice.json')
        .then(res=>{
            console.log(res);
        });
        this.$eventBus.$emit("loadingStatus",false);
    }
  }

It's showing an error message that

Error in v-on handler: "TypeError: Cannot read property 'get' of undefined"

Maxim Dyuzhinov · Accepted Answer · 2020-10-03 10:59:46Z

1

You see the error, because "$axios" object that you define inside a Main.js module is not defined inside your ./App.js module. You should pass it there somehow. Consider to use vue mixins or component extention or composition API.

answered Oct 3, 2020 at 10:59

Maxim Dyuzhinov

3082 silver badges6 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Iqbal Hossain Over a year ago

How to pass ? Give me an example please.

Maxim Dyuzhinov Over a year ago

The simplest way is to import axios inside App.js: ` import axios from 'axios'; ` and then using it as a regular module: ` loginMethode(){ ... axios.get('api.coindesk.com/v1/bpi/currentprice.json') .then(res=>{ console.log(res); }); ... } `

Iqbal Hossain Over a year ago

I am using axios from my Login.vue file. How to import in .vue file ? Ihave updated my full code from where I am using this axios.

Collectives™ on Stack Overflow

Vue.js: Axios is not working in Vue when calling an API

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related