CODEWITHSUNDEEP
vue.jsaxios
ankitkanojia
ankitkanojia

Reputation: 3122

How to make API call using axios in Vue.js?

I have tried to call API using Axios in vue.js app, API called successfully but the value is not affected. I wanted to set value which returns from the API response.

Sample URL

Vue.js code

new Vue({
  el: '#app',
  data () {
    return {
      info: null
    }
  },
  mounted () {
    axios
      .get('https://api.coindesk.com/v1/bpi/currentprice.json')
      .then(response => (this.info = response))
  }
})

HTML code

<script src="https://unpkg.com/vue"></script>

<div id="app">
  {{ info }}
</div>

Upvotes: 0

Views: 1470

Answers (1)

Niklesh Raut
Niklesh Raut

Reputation: 34914

I think you missed to include axios

new Vue({
  el: '#app',
  data () {
    return {
      info: null
    }
  },
  mounted () {
    axios
      .get('https://api.coindesk.com/v1/bpi/currentprice.json')
      .then(response => (this.info = response))
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.0/axios.js"></script>
<script src="https://unpkg.com/vue"></script>

<div id="app">
  {{ info }}
</div>

Upvotes: 2

Related Questions