axios is one of the most famous JS package available on github. It is a promise based HTTP client for javascript. It can used both on frontend or backend(node.js).
Example to make http get request with javascript:
// Make a request for a user with a given ID
axios.get('/user?ID=12345')
.then(function (response) {
// handle success
console.log(response);
})
.catch(function (error) {
// handle error
console.log(error);
})
.then(function () {
// always executed
});
Example to make http post request with javascript:
axios.post('/user', {
firstName: 'Fred',
lastName: 'Flintstone'
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
For convenience aliases have been provided for all supported request methods.
axios.request(config)
axios.get(url[, config])
axios.delete(url[, config])
axios.head(url[, config])
axios.options(url[, config])
axios.post(url[, data[, config]])
axios.put(url[, data[, config]])
axios.patch(url[, data[, config]])
There are times when we might not get the data we need from the API. There are several reasons that our axios call might fail, including but not limited to:
When making this request, we should be checking for just such circumstances, and giving ourselves information in every case so we know how to handle the problem. In an axios call, we’ll do so by using catch
.
axios
.get('https://xyz.com/api')
.then(response => (this.info = response.data.bpi))
.catch(error => console.log(error))
Here is the example how axios can be used in your vuejs component. It has considered that axios has already installed & added.
new Vue({
el: '#app',
data () {
return {
info: null
}
},
mounted () {
axios
.get('https://api.coindesk.com/v1/bpi/currentprice.json')
.then(response => (this.info = response))
}
})
Reference link