Categories
Vue Answers

How to Use Axios Globally in a Vue App?

Spread the love

Sometimes, we want to use the Axios HTTP client globally in our Vue app.

In this article, we’ll look at how to use the Axios HTTP client globally in our Vue app.

Using Axios Globally in a Vue App

To make Axios available globally, we can set it as the property of Vue.prototype before we create the Vue instance.

This way, it’ll be returned with the Vue instance if we create the Vue instance.

For example, we can write:

import Axios from 'axios'

Vue.prototype.$http = Axios;

Then in our components, we can access it by using the this.$http variable.

For instance, if we want to make a get request, we can write:

this.$http.get('https://example.com')

Conclusion

To make Axios available globally, we can set it as the property of Vue.prototype before we create the Vue instance.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *