For v3.x, click here. There are many times when building application for the web that you may want to consume and display data from an API.
There are several ways to do so, but a very popular approach is to use axios, a promise-based HTTP client.
In this exercise, we’ll use the CoinDesk API to walk through displaying Bitcoin prices, updated every minute.
First, we’d install axios with either npm/yarn or through a CDN link.
There are a number of ways we can request information from the API, but it’s nice to first find out what the shape of the data looks like, in order to know what to display.
In order to do so, we’ll make a call to the API endpoint and output it so we can see it.
See the Pen First Step Axios and Vue by Vue (@Vue) on CodePen.
In our case, we can see that the price information we need lives in response.data.bpi.
If we use this instead, our output is as follows:.